react 嵌套渲染_react组件嵌套

输出组件

表达式({ })不仅能输出数据，还是输出元素。

class Cmp extends React.Component{

constructor(...args){

super(...args)

}

render(){

let span = spanaaa

return (

{this.props.text},{span}

)

}

}

let rootCont = document.getElementById('root')

let a =

ReactDOM.render((

{a}

),rootCont)

//输出：

// 我是A,spanaaa

// 我是B,spanaaa

输出组件数据

直接声明一个数组，数组中为相应的组件，如下代码中的写法直接使用{spanlist },页面中是可以直接输出的，但是控制台是会报错，提示没有设置key,在react中的虚拟DOM变化的时候，就需要动态的设置真是的DOM，这个时候就需要通过key来跟踪循环中的虚拟DOM，来相应真实DOM的正确渲染,key不能重复,且不能修改，修改的话后可能会引起报错样式窜行。如果是使用的单变量进行一个一个添加的话，react会自动的添加key

Warning: Each child in an array or iterator should have a unique "key" prop.