栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

在另一个组件中反应JS参考函数

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

在另一个组件中反应JS参考函数

您可以通过创建一个负责管理状态的父组件来完成此任务,然后将状态作为道具向下推到子组件。

var Inputs = React.createClass({    render: function () {        var items = [];        var inputs;        for (var i = 0; i < this.props.count; i++) { items.push( <input type="text" name={[i]} />); items.push(<br />);        }        return (  <div className = "col-md-9">      <form action = "/" method = "post" name = "form1">          {items}          <input type="submit" className="btn btn-success" value = "Submit Form" />      </form> </div>        );    }});var Add = React.createClass({    render: function () {        return (<input type = "button" className="btn" value="Add an Input" onClick={this.props.fnClick}/> );  }});var Parent = React.createClass({    getInitialState: function(){        return {count:1}    },    addInput: function(){        var newCount = this.state.count + 1;        this.setState({count: newCount});    },    render: function(){        return ( <div>     <Inputs count={this.state.count}></Inputs>     <Add fnClick={this.addInput}/> </div>        );    }});React.renderComponent(<Parent></Parent> , document.body);

jsFiddle



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/371238.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号