Skip to content

Files

Latest commit

mzkmzkmzkmzk
Update ji_shi_qi.md
Mar 27, 2016
89d0635 · Mar 27, 2016

History

History
40 lines (34 loc) · 1.13 KB

ji_shi_qi.md

File metadata and controls

40 lines (34 loc) · 1.13 KB

计时器

<!DOCTYPE html>
<html>
<body>
<div id="container"></div>

<script src="https://fb.me/react-0.14.7.js"></script>
<script src="https://fb.me/react-dom-0.14.7.js"></script>

<script>
    var ExampleApplication = React.createClass({
        render: function() {
            var elapsed = Math.round(this.props.elapsed  / 100);
            var seconds = elapsed / 10 + (elapsed % 10 ? '' : '.0' );
            var message =
                    'React has been successfully running for ' + seconds + ' seconds.';
            return React.DOM.p(null, message);
        }
    });

    var start = new Date().getTime();
    setInterval(function() {
        ReactDOM.render(
                React.createElement(ExampleApplication,{elapsed: new Date().getTime() - start}), 
                document.getElementById('container') 
        );
    }, 50);
</script>
</body>
</html>

1. 疑惑点

  1. 使用react,必须引入react和react-dom
  2. this.props.属性 : 外部调用本组件传递的属性值.
  3. React.createClass中的render : 返回的为该组件显示的内容
  4. ReactDOM.render(显示的组件,带插入的节点)