React 互动表单

html:


<html>
    <head>
        <script src="https://fb.me/react-0.13.3.js">script>
        <script src="https://fb.me/JSXTransformer-0.13.3.js">script>
    head>
    <body>
        <script type="text/jsx">
        var Input = React.createClass({
            getInitialState: function() {
                return {value: 'Hello!'};
            },

            handleChange: function(event) {
                this.setState({value: event.target.value});
            },

            render: function () {
                var value = this.state.value;
                return (
                    <div>
                        <input type="text" value={value} onChange={this.handleChange} />
                        <p>{value}p>
                    div>
                );
            }
        });

        React.render(<Input/>, document.body);
        script>
    body>
html>

这里写图片描述

你可能感兴趣的:(React)