龙空技术网

React.js中组件的属性使用展开运算符

Javascript 407

前言:

眼前我们对“js获取控件的属性”大致比较注重,我们都需要分析一些“js获取控件的属性”的相关知识。那么小编也在网上汇集了一些关于“js获取控件的属性””的相关知识,希望同学们能喜欢,看官们一起来了解一下吧!

在React中我们经常会给属性赋值

上面为react的jsx

我们也可以使用对象展开运算符 " ... " 进行赋值

打印下div 发现两个效果是一致的

JSX上面的属性会出现props对象当中

我们可以这样理解,就是在react元素中的props属性中展开了这个对象:

这是模拟react对jsx的转化后的元素。实际上生成的这个props属性是只读的,props里面的属性也是只读的

这个时候感觉这个展开运算符是和ES6中的是一样的,但实际上还是有很多不同的

例如:

这说明react.js中的...并不是javascript中的扩展运算符,至少有所不同

按展开运算符来说,下面两个应该是正确的

实际上,这里是JSX的语法规范,不是ES6的展开运算符。

编译打包时,Babel 会把 JSX 转译成一个名为 React.createElement() 函数调用,返回一个对象(React元素,虚拟DOM)。再调用ReactDOM.render把它转化成真实DOM。

标签: #js获取控件的属性