react屬性傳值 key:value形式
阿新 • • 發佈:2019-01-01
key:value傳值
步驟:
1、通過<Demo obj={obj} arr={arr} name="hello" str="hi"/>
<Demo obj={obj} arr={arr} name="hello" str="hi"/>
2、通過{this.props.name}接收
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="../lib/react.min.js" type="text/javascript" charset="utf-8"></script> <script src="../lib/react-dom.min.js" type="text/javascript" charset="utf-8"></script> <script src="../lib/browser.min.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div id="out"></div> </body> <script src="js/a2.js" type="text/babel" charset="utf-8"></script> </html>
var arr=[1,2,'hii'] var obj={ name:'小明', age:22 } var Demo=React.createClass({ render(){ console.log(this.props) return( <div> <h1>屬性</h1> <p>{this.props.name}</p> <p>{this.props.arr[2]}</p> <p>{this.props.obj.name}</p> <p>{obj.name}</p> </div> ) } }) ReactDOM.render(<Demo obj={obj} arr={arr} name="hello" str="hi"/>,document.getElementById('out'))