1、JSX是什么?
JSX是JavaScript的一种语法扩展,它和模板语言很接近,但是它充分具备JavaScript的能力。-
2、JSX语法是如何在JavaScript中生效的?
因为JSX是JS的扩展,所以浏览器并不会像天然支持JavaScript支持JSX,所以我们需要用到Babel来解析。 JSX会被编译为React.createElement(),React.creacteElement()将会返回一个叫做“React Element(虚拟DOM)”的JS对象。
3、Babel是什么?
Babel是一个工具链,主要用于ECMAScript2015+版本的代码转换为向后兼容的JavaScript语法,以便能够运行在当前环境和旧版本的浏览器或其它环境中。4、JSX的本质是?
综合上述几个问题,可以得出结论,JSX的本质其实就是React.createElement(),虽然它看上去像是我们写的HTML。5、虚拟DOM是如何渲染成真实DOM的?
通过ReactDOM.render()
ReactDOM.render(
//需要渲染的元素
element,
//元素挂载的目标容器,一个真实DOM
container,
//回调函数,可选,用来处理渲染结束后的逻辑
callback
)