JSX简介

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

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

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

jsx防注入攻击


元素渲染

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

ReactDOM.render()方法

const ele =

hello,word

;

ReactDOM.render(

    ele,

    document.getElementById('root')

);

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


组件&Props

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

定义组件的方式:

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

function Demo(props){

        return

hello,{ props.name }

;

}

2.使用es6 的class

class Demo extends React.Component {

   render(){

      return

hello,{ this.props.name }


   }

}

Props的只读性

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


你可能感兴趣的:(JSX简介)