引入React
可以使用Bower下载React
bower install react
引入react(.min).js
和JSXTransformer.js
。在React组件中可以不使用JSX,但建议使用 JSX。引入 JSXTransformer.js 库是来实现在浏览器里的代码转换,上线之后最好把JSX代码转换成正常的js代码,然后去掉JSXTransformer.js
的引用。
JSX代码写在<script type="text/jsx">
中,注意type
是text/jsx
。
JSX -> JS
npm install -g react-tools jsx --watch src/ build/
一旦src中的JSX文件修改了,就会自动转换到build文件夹中。
Hello World
一个最简单的React组件。
html文件
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="helloworld"></div> <script src="bower_components/react/react.min.js"></script> <script src="bower_components/react/JSXTransformer.js"></script> <script src="js/main.js" type="text/jsx"></script> </body> </html>
main.js文件
var HelloWorld = React.createClass({ render: function () { return <h1>Hello {this.props.name}</h1>; } }); React.render(<HelloWorld name="World" />,document.getElementById('helloworld'));
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。