ReactJS - 我可以从不同的组件打开一个模式吗答案

【问题标题】：ReactJS - Can I open open a Modal from different componentReactJS - 我可以从不同的组件打开一个模式吗
【发布时间】：2017-07-07 17:14:54
【问题描述】：

我试图通过单击另一个组件（list.js）中的按钮来调用“model.js”中的模型，只是想知道我是否错过了任何步骤，请参见下文：

model.js

import React from 'react';

class Model extends React.Component{

 render(){
  return(
   <div>
    //code inside the Model etc...  
    <Button onClick={this.submit.bind(this)}>Submit</Button>
   </div>
  )
 }
}

export default Model;

list.js

import Model from './model';
class List extends React.Component{
 render(){

  constructor() {
  super();

   this.toggleModal = this.toggleModal.bind(this);
   this.state = {
     open: false
   }
  }

  toggleModal() {
   this.setState({
   open: this.state.open
   });
  }

return(
 <div>
  <Button onClick={this.toggleModal}>Add</Button>
 </div>
 <div>
  <Model open={this.state.open} toggleModal={this.toggleModal}/>
 </div>
  )
 }
}

export default List;

我尝试了很多方法来更改 List 中的事件处理程序代码，但它仍然不起作用。

如果你们能帮我指出问题出在哪里，那将不胜感激。

【问题讨论】：

标签： reactjs simplemodal

【解决方案1】：

您肯定会错过感叹号，因为就目前而言，单击按钮时始终会分配false 值-不会显示模式。

this.setState({
  open: !this.state.open
});

【讨论】：

【解决方案2】：

为什么不将状态 open 值更改为 true 或 false

this.setState({
   open: this.state.open
});

上面的代码总是将值设置为false。也许你可以做的是!this.state.open

【讨论】：

很高兴为您提供帮助 :)