JSX简介

jsx——一种JavaScript的语法扩展，在html中写入js

在jsx中使用表达式，在jsx当中的表达式要包含在大括号中，列如：2+2 ； user.name ; formatName(user) 都是可以使用的

class=> className; tabindex=> tabIndex 驼峰命名来定义属性

jsx防注入攻击

---

元素渲染

元素是构成React应用的最小单位

ReactDOM.render()方法

const ele = <h1>hello,word</h1>;

ReactDOM.render(

    ele,

    document.getElementById('root')

);

当元素被创建之后，你是无法改变其内容或属性的，一个元素就好像是动画里的一帧，它代表应用界面在某一时间点的样子

---

组件&Props

组件可以将UI切分成一些的独立的，可复用的部件，这样你就只需专注于构建每一个单独的部件

定义组件的方式：

1.最简单的方式是使用JavaScript函数

function Demo（props）{

        return <h1>hello,{ props.name } </h1>;

}

2.使用es6 的class

class Demo extends React.Component {

   render(){

      return <h1>hello,{ this.props.name }</h1>

   }

}

Props的只读性

所有的React组件必须像纯函数那样使用它们的props

---