React-基础总结

使用1、

// js文件,第一部引入React(大写,不然保错)
import React from 'react'
// 创建数组
const arrList = Array.from({length:60},(_item,index)=>index)
const arr = arrList.map(item => <div key={item}>{`${item}秒是${item%2==0?'偶数':'奇数'}`}</div>)
const ele = <div>{arr}</div>
export default ele
// index中的代码
// 引入
import React from 'react'
import {render} from 'react-dom'
// import ele from './day-01-插值'
// import ele from './day-01-条件渲染'
import ele from './01-列表渲染'
// react元素
// const ele = <div>hello world</div>
// 挂载点
let box = document.querySelector('#app')
console.log(box)
// 挂载
render(ele,box)
// package.json
"scripts": {
"start": "parcel src/index.html",
"test": "echo \"Error: no test specified\" && exit 1"
},
React-基础总结的更多相关文章
- react基础(1)
在 react入门系列 里面,介绍了一些react的基础知识,在react基础部分,会结合手脚架工具进行更多的总结. 关于webpack我在这里就不讲解了,有需要的小伙伴可以自己去百度一下学习资料,我 ...
- react基础(2)
react基础(1):介绍了如何创建项目,总结了JSX.组件.样式.事件.state.props.refs.map循环,另外还讲了mock数据和ajax 还是用 react基础1 里创建的项目继续写案 ...
- react基础语法(五) state和props区别和使用
props的验证: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...
- react基础用法二(组件渲染)
react基础用法二(组件渲染) 如图所示组件可以是函数 格式:function 方法名(){ return <标签>内容</标签>} 渲染格式: <方法名 /> ...
- react基础用法一(在标签中渲染元素)
react基础用法一(渲染元素) 如图所示最简单的变量使用方法 格式 let 变量名称 = 赋值: 渲染格式直接用 {变量名称} 就可以直接渲染到页面 如图所示第二种渲染方法 格式 const 变量名 ...
- AntDesign(React)学习-3 React基础
前面项目已经建起来了,但是没有React基础怎么办,从头学习,这个项目使用的是基于React16.X版本的几种技术集成,那么我们就从网上找一些相关的资料进行研究,我的习惯是用到哪学到哪. 一.先看一些 ...
- React 基础入门,基础知识介绍
React不管在demo渲染还是UI上,都是十分方便,本人菜鸟试试学习一下,结合阮一峰老师的文章,写下一点关于自己的学习react的学习笔记,有地方不对的地方,希望各位大牛评论指出: PS:代码包下载 ...
- React基础语法学习
React主要有如下3个特点: 作为UI(Just the UI) 虚拟DOM(Virtual DOM):这是亮点 是React最重要的一个特性 放进内存 最小更新的视图,差异部分更新 diff算法 ...
- React 基础入门
React 起源于 Facebook 内部项目,是一个用来构建用户界面的 Javascript 库,相当于MVC架构中的V层框架,与市面上其他框架不同的是,React 把每一个组件当成了一个状态机,组 ...
- react基础
上一篇文章主要是记录了自己是如何创建react项目的,今天则主要是总结一下react中的一个基础入门知识,包括数据定义和绑定.属性绑定.数组循环等等. 组件继承和挂载 当我们使用脚手架或者命令行创建一 ...
随机推荐
- shell变量(二)
变量名的命名规范: 1.命名只能使用英文字母.数字和下划线,且不能以数字开头: 2.不能存在空格‘: 3.不能使用标点符号: 4.不能使用bash里的关键字(可使用help命令查看保留关键字) 变量的 ...
- .Net Core3.0 配置Configuration
准备 .NET core和.NET项目配置上有了很大的改变,支持的也更加丰富了比如命令行,环境变量,内存中.NET对象,设置文件等等..NET项目我们常常把配置信息放到webConfig 或者appC ...
- SQL 方面基础操作,主要针对数据库方面的操作步骤
SQL 结构化查询语言 适用于所有的SQL数据库 SQL 要求每条指令后末端 都要有分号(;),分号是标准方法,对服务器相同请求中执行一条以上的sql语句. 最终目的: 实现对数据库数据的 增 ...
- String s=new String("123") 创建了两个对象,及证明
这个问题百度上有很多答案 有一次面试的时候,面试官也提到了这个问题.我回答了两个对象,并且解释了一个对象是 "123" 存在了字符串常量池,另一个是 s 所引用的堆中的对象. 但是 ...
- arango集群部署
arango集群部署 ############arango集群操作################## arangodb3-3.3.16-1.x86_64.rpm(使用rpm包方式安装) arango ...
- C语言知识体系
吾尝终日而思矣,不如须臾之所学也: 吾尝跂而望矣,不如登高之博见也. 登高而招,臂非加长也,而见者远: 顺风而呼,声非加疾也,而闻者彰. 假舆马者,非利足也,而致千里: 假舟楫者,非能水也,而绝江河. ...
- MIT线性代数:6.列向量和零空间
- 真正的打包scrapy单文件(不包含cfg)
前置:https://www.cnblogs.com/luocodes/p/11827850.html 解决最后一个问题,如何将scrapy真正的打包成单文件 耗了一晚上时间,今天突然有灵感了 错误分 ...
- Python 中 -m 的典型用法、原理解析与发展演变
在命令行中使用 Python 时,它可以接收大约 20 个选项(option),语法格式如下: python [-bBdEhiIOqsSuvVWx?] [-c command | -m module- ...
- map和set的使用及top K问题
1.map和set的应用和比较 map和set都是关联式容器,底层容器都是红黑树. map以键值对的形式进行存储,方便进行查找,关键词起到索引的作用,值则表示与索引相关联的数据,以红黑树的结构实现,插 ...