1.1createElement()的问题
1繁琐不简洁
2不直观 无法一眼看出所描述的结构
3不优雅 用户体验不爽
React.createElement("div", {classsName:"shopping-list"}, React.createElement("h1",null,"shopping List") React.createElement( "ul",null,React.createElement("li",null,"Instagram"), React.createElement("li",null,"whatsApp") ) ) <div className="shopping-list"> <h1>shopping List</h1> <ul> <li>Instagram</li> <li>whatsApp</li> </ul> </div> ----------------------------------- ©著作权归作者所有:来自51CTO博客作者前端歌谣的原创作品,请联系作者获取转载授权,否则将追究法律责任 好客租房10-jsx的基本使用 https://blog.51cto.com/u_14476028/5290301
1.2JSX简介
jsx是javascript XML的简写,表示在javaScript代码中xml(HTML)格式的代码
优势:声明式语法更加直观 和HTML结构相同 降低了学习成本 提升开发效率
1.3使用步骤
//第一步创建jsx创建react元素 const title = <h1>hello Geyao</h1> //第二步渲染React元素 ReactDOM.render(title,document.getElementById("root"))