1.React引入,创建渲染虚拟DOM,JSX语法规则

48 阅读1分钟

所需依赖包:

image.png ReactDOM.render(虚拟DOM,容器DOM)渲染虚拟DOM(bable下的脚本为JSX语法)

image.png 效果:

image.png

使用JS语法利用React.createElement(标签,属性,内容)创建虚拟DOM(不推荐)

image.png

JSX语法规则: 1.定义虚拟DOM时,不要写引号。 2.标签中混入JS表达式时要用{}。 3.样式的类名指定不要用class,要用className。 4.内联样式,要用style={{key:value}}的形式去写。 5.只有一个根标签 6.标签必须闭合 7.标签首字母 (1).若小写字母开头,则将该标签转为html中同名元素,若html中无该标签对应的同名元素,则报错。 (2).若大写字母开头,react就去渲染对应的组件,若组件没有定义,则报错。 image.png

数组遍历生成元素:

image.png

面试相关:

image.png