JSX语法及学习

jsx.jpg

JSX 是 Javascript 代码里直接写XML的语法


JSX (Javascript XML syntax transform) 是使用XML语法编写Javascript的一套解析工具; X代表XML;也可以理解为扩展(eXtension),因为实现JSX功能本身就是使用Javascript; React建议使用JSX(但非必要)


实质上这只是一个语法糖,每一个XML标签都会被JSX转换工具转换成纯Javascript代码

React 官方推荐使用JSX, 当然你想直接使用纯Javascript代码写也是可以的,只是使用JSX,组件的结构和组件之间的关系看上去更加清晰


使用 JSX


React.render(
    <div>
        <div>
            <div>content</div>
        </div>
    </div>,
    document.getElementById('example')
);

不使用JSX


React.render(
    React.createElement('div', null,
        React.createElement('div', null,
            React.createElement('div', null, 'content')
        )
    ),
    document.getElementById('example')
);

对比

var Nav;
var app =



回到顶部