如何动态地更改内容引导模式响应？
我试图在安装后更改modala的内容，但我找不到正确的节点来更改。 我附上了与我感兴趣的节点的链接，并试图改变它们 componentDidMount//. 但找不到节点 - 事实证明 null.
var Modal = ReactBootstrap.Modal;
const MyModal = React.createClass/{
getInitialState// {
return { showModal: false };
},
close// {
this.setState/{ showModal: false }/;
},
open// {
this.setState/{ showModal: true }/;
},
componentDidMount// {
var theNode = ReactDOM.findDOMNode/this.refs.bigPic/;
var theOtherNode = ReactDOM.findDOMNode/this.refs.bigPicInfo/;
theNode.src = 'http://big-pic.png';
theOtherNode.innerHTML = "<strong> Something here</strong>";
},
render// {
return /
<div>
<modal onhide="{this.close}" show="{this.state.showModal}">
<modal.header closebutton="">
<modal.title></modal.title>
</modal.header>
<modal.body>
<div><img ref="bigPic" src=""/></div>
</modal.body>
<modal.footer>
<p ref="bigPicInfo"></p>
</modal.footer>
</modal>
</div>
/;
}
}/;
ReactDOM.render/<mymodal></mymodal>, document.getElementById/"my-modal"//;
没有找到相关结果
已邀请:
2 个回复
裸奔
赞同来自:
用于模态元素的动态显示。 可能更改的所有内容都必须是默认值
, 然后打电话
使用您的新价值。这将调用您组件的重新可视化。
const MyModal = React.createClass/{
getInitialState// {
return {
showModal: false,
bigPicSrc: '',
infoContent: ''
}
},
...
componentDidMount// {
this.setState/{
bigPicSrc: 'http://big-pic.png'
infoContent: <strong>Something here</strong> // not a string, but a component
}/
},
render// {
return /
<modal onhide="{this.close}" show="{this.state.showModal}">
<modal.header closebutton="">
<modal.title></modal.title>
</modal.header>
<modal.body>
<div><img ref="bigPic" src="{this.state.bigPicSrc}"/></div>
</modal.body>
<modal.footer>
<p ref="bigPicInfo">{this.state.infoContent}</p>
</modal.footer>
</modal>
/
}
}/
江南孤鹜
赞同来自:
成分
来自文件夹
SRC
应用程序 ny. 下一步我将引导代码从新文件示例中放置 modal.js 并更改引导类 clssName 对其做出反应。 和莫代尔一起担任此文本的点击才能显示调制
.
并认为要更改调制范围内容，必须使用某些文件数据的数据 Json 在那里，您必须连接字段 id 数据 Json 事件 ref 或者 id tigger 挑战这个modala。 总是不同的现场标识符字段事件来自 data.json. 我认为最好使用开关外壳以便于选择。