react知识点
http://www.cocoachina.com/webapp/20150721/12692.html
http://blog.csdn.net/slandove/article/details/50748473
http://www.oschina.net/news/76862/react-component-life-circle
注意:
下面我们在script标签里面编写代码,来输出Hello,world,代码如下:
这里需要注意的是,react并不依赖jQuery,当然我们可以使用jQuery,但是render里面第二个参数必须使用JavaScript原生的getElementByID方法,不能使用jQuery来选取DOM节点。
下面,我们来编写第一个组件Greet,有一个name属性,然后输出hello + name的值,代码如下:
看到这段代码,接触过AngularJS的朋友们是不是有一种熟悉的感觉,不过这里有几点需要注意:
1)获取属性的值用的是this.props.属性名
2)创建的组件名称首字母必须大写。
3)为元素添加css的class时,要用className。
4)组件的style属性的设置方式也值得注意,要写成style={{width: this.state.witdh}}。
react知识点的更多相关文章
- React知识点总结1
最近打算把react知识点总结下: React特点 1.虚拟DOM 在内存中操作DOM,在内存中创建数据结构,只会更新有差异的地方 2.组件化 页面分成若干个组件,每个组件包含逻辑结构和样式 组件仅包 ...
- react知识点汇总
①uncontrolComponent & controlComponent If your form is incredibly simple in terms of UI feedback ...
- react 知识点2
从 render 函数可以看出来,组件内部是通过 this.props 的方式获取到组件的参数的,如果 this.props 里面有需要的属性我们就采用相应的属性,没有的话就用默认的属性. 那么怎么把 ...
- react 知识点
1.react内联样式写法: <div style={{width:'200px',height:'100px',border:'1px solid red'}}> </div> ...
- react知识点总结(持续更新。。。)
一.webpack 1. 什么是以及为什么要使用webpack 现在的网页功能越来越丰富,所需要的JavaScript和模块也会很多,为开发更加简洁,出现了以下方法,如模块化,scss,typescr ...
- React知识点整理
面试题:三大框架中数据绑定实现上有何绑定? 一.概述:是Facebook维护的一个构建用户界面的JS库,核心很精简,但是生态圈扩展很大. React:MVVM框架 React-Router:路由 Re ...
- 4-13 Webpacker-React.js; 用React做一个下拉表格的功能: <详解>
Rails5.1增加了Webpacker: Webpacker essentially is the decisions made by the Rails team and bundled up i ...
- React实战一
目录 1. 搭建环境 2. React知识点 1. 组件 1.1 定义一个组件 1.2 组合与拆分组件 1.3 组件传值 1.4 state 1.5 生命周期函数 1.6 无状态组件 1.7 List ...
- React 解析/ 第二节 使用 Reac
官方脚手架 create-react-app React 提供了一个官方的命令行工具(CLI)—— create-react-app,是专门用于快速搭建单页面应用(SPA)的脚手架,它基于 Webpa ...
随机推荐
- git 入门教程之 git bash 竟然不支持 tree 命令
开门见山 git bash 是 Windows 用户安装 git 时默认安装的命令行工具,不仅界面漂亮功能也不错,大多数情况下可以替代 Windows 原生的 cmd 命令行. 然而,git bash ...
- Python 链表(linked list)
链表是一种物理存储单元上非连续.非顺序的存储结构,数据元素的逻辑顺序是通过链表中的指针链接次序实现的 链表由一系列结点组成,结点可以在运行时动态生成 优点 由于不必须按顺序存储,链表在插入.删除的时候 ...
- csp模拟题-201903
1.小中大(100分) #include<iostream> #include<cstdio> #define maxn 100010 using namespace std; ...
- Codeforces Round #553 (Div. 2) E 贡献
https://codeforces.com/contest/1151/problem/E 题意 一条长n的链,每个点上有值\(a[i]\),定义\(f(l,r)\)为该区间的\(值\)所代表的点留下 ...
- Codeforces Round #553 (Div. 2) C 等差数列求和 + 前缀和
https://codeforces.com/contest/1151/problem/C 题意 有两个等差数列(1,3,5,..),(2,4,6,...),两个数列轮流取1,2,4,...,\(2^ ...
- 【转】UML各种图总结
UML(Unified Modeling Language)是一种统一建模语言,为面向对象开发系统的产品进行说明.可视化.和编制文档的一种标准语言.下面将对UML的九种图+包图的基本概念进行介绍以及各 ...
- Qt所有滚动条的样式
const QString QSS_VerticalScrollBar = "" "QScrollBar:vertical{" //垂直滑块整体 "m ...
- 手把手教你使用gogs搭建git私有仓库
本来想在 Github 上建一个私仓,但是发现只能设置 3 个贡献者. 国内的码云也只能设置 5 个. 无意间看到了使用 gogs 可以搭建私服,正好手头有空闲的服务器,于是开干! https://g ...
- Docker相关安装和卸载
安装: 1.Docker要求CentOS系统的内核版本高于 3.10 ,通过 uname -r 命令查看你当前的内核版本是否支持安账docker 2.更新yum包:sudo yum update 3. ...
- ICT638 Mobile and App Development
Assessment Cover SheetStudent ID CohortStudent NameProgrammeEnrolledDiploma in Information Technolog ...