React学习笔记(二)
来源:互联网 发布:千兆网络交换机价格 编辑:程序博客网 时间:2024/05/17 02:10
React 组件语法
<div id="example"></div><script type="text/babel"> class MyPage extends React.Component { render() {return <h4>Hello 我们在一起吧</h4>;} }; ReactDOM.render(<MyPage/>,document.getElementById('example'));</script>
- class MyTitle extends React.Component是 ES6 语法,表示自定义一个MyTitle类,该类继承了基类React.Component的所有属性和方法。
- React 规定,自定义组件的第一个字母必须大写,比如MyTitle不能写成myTitle,以便与内置的原生类相区分。
- 每个组件都必须有render方法,定义输出的样式。
- 表示生成一个组件类的实例,每个实例一定要有闭合标签,写成也可。
React 组件的参数
<div id="example"></div><script type="text/babel"> class MyTitle extends React.Component { render() { return <h1 style={{color: this.props.color}}>Hello World</h1>; } }; ReactDOM.render( <MyTitle color="red" />, document.getElementById('example') );</script>
组件内部通过this.props对象获取参数。
0 0
- React学习笔记(二)
- React Native 学习笔记(二)
- React Native 学习笔记(二)
- react && redux 学习笔记(二)
- React-Native学习笔记(二)
- react项目学习笔记二(react-router)
- React-native 学习笔记二
- React学习笔记_redux二
- React 学习 (二)
- React Native学习笔记(二)JSX 语法学习
- React笔记汇总(二)
- react整理二阶段学习笔记
- react学习札记(二)
- React 初步学习(二)
- React Native学习(二)
- React学习笔记(一)
- react学习笔记(1)
- react学习笔记(2)
- 生成最少树
- 10059---java反射实现bean的copy
- 【0321】供应链、产品、获客
- Caffe学习日记9
- 【LeetCode】529. Minesweeper
- React学习笔记(二)
- 442. Find All Duplicates in an Array
- 求两个正整数的最大公约数
- C++Primer笔记--vector 对象 string 对象的下标操作警告
- jQuery ui中日期控件datepicker的使用整理
- 基本IO操作(一)
- 大搬家
- Java语言基础(六)-数组
- 第二十九、Java之值传递