首页 > 代码库 > react.js
react.js
<html><head><script src="../build/react.js"></script><script src="../build/react-dom.js"></script><script src="../build/browser.min.js"></script></head><body><div id="test"></div><script type="text/babel">//-------dome1ReactDOM.render(<h1>hellow,word1111!</h1>,document.getElementById(‘test‘));</script></body></html>
dome2
// ---------dome2var names = [‘xiaom‘,‘xiaohong‘,‘xiaohei1‘];ReactDOM.render(<div> { names.map(function(name){ return <div>hellow,{name}!</div> }) }</div>,document.getElementById(‘test‘));
dome3
var names=[ <h1>hellow:number 1</h1>, <h3>hellow:number 2</h3> ];ReactDOM.render( <div>{names}</div>, document.getElementById(‘test‘) );
** 注意 双标签必须合法 不然会报错 Uncaught SyntaxError: embedded: Unexpected token
结果:
dome4:
var HelloClass = React.createClass({ render:function(){ return <h1>hellow:{this.props.name}</h1>; }});ReactDOM.render( <HelloClass name="liuhulan"/>,document.getElementById(‘test‘));//注意:组建的类的首字母必须大写 !
dome5
var TestClass = React.createClass({ render:function(){ return( <ol> { React.Children.map(this.props.children,function(test){ return <li>{test}</li>; }) } </ol> ); }});ReactDOM.render( <TestClass> <span>9897878</span> <span>911111</span> </TestClass>, document.getElementById(‘test‘));// this.props.children // map :循环
dome6
dome7
dome8
dome9
dome10
dome11
dome12
react.js
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。