翻译--https://github.com/ruanyf/react-demos/blob/master/README.md

此文章为阮一峰大神写的关于react的DEMOreact的DEMO, 建议看英文版
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
此项目是一个针对reactJS 简单DEMO的集合.
有道是大繁若简, 在没有样式的前提下, DEMO被写出来; 同样, 你会发现, 在跟随这些DEMO学习react的过程中, 基本上没有什么难点.

  • Flux Demo
  • Webpack Demos
  • React Router Tutorial
  • CSS Modules Demos
  • React Testing Demo
  • A boilerplate for React-Babel-Webpack project

如何使用

首先用git把项目拷贝到你的磁盘上

$ git clone git@github.com:ruanyf/react-demos.git

接下来就可以运行你的demo啦

HTML Template


<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="example">div>
    <script type="text/babel">

      // ** Our code goes here! **

    script>
  body>
html>

Demo01: Render JSX

demo / source

React中的模板语法是继承自 JSX. 在JSX语法中, 将HTML标签直接写到JS代码中, 这是被允许的. ReactDOM.render() 是一个可以将JSX语法转化为HTML标签的方法, 并且在特定的DOM节点中渲染出来.

ReactDOM.render(
  <h1>Hello, world!h1>,
  document.getElementById('example')
);

需要注意的是: 你必须要用

你可能感兴趣的:(react)