React 互动表单

最新推荐文章于 2023-10-18 21:10:04 发布

绿苹果果

最新推荐文章于 2023-10-18 21:10:04 发布

阅读量943

点赞数

分类专栏： React 文章标签： React 表单

本文链接：https://blog.csdn.net/dongshaoshuai/article/details/47804673

版权

React 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

html:

<!DOCTYPE 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>