реагировать, как сделать вызов модальным, когда событие нажатия кнопки - PullRequest
Новая
       9

реагировать, как сделать вызов модальным, когда событие нажатия кнопки

0 голосов
/ 14 сентября 2018

Я хочу сделать, когда я нажимаю кнопку, показать модальное в другом классе. как это сделать? 

import React, { Component } from 'react';
import addmodal from './addmodal';

class page extends Component {
  ...//skip
  handleAdd= () =>{
    //...how?
  }
  render(){
    return (
      <button onClick={this.handleAdd} > Add </button>
      )
   }
}


import React, { Component } from 'react';

class addmodal extends Component {
   // ... skip
  render(){
    return(
      <modal inOpen={this.state.isopen} >
        ...//skip
      </modal>
    )
  }
}

export default addmodal;

Я не могу назвать этот addmodal ... как назвать модал?

1 Ответ

0 голосов
/ 14 сентября 2018

Во-первых, ваше именование переменных ужасно.Я установил это для вас здесь.Состояние, которое определяет, открыт ли модальный режим, должно быть в родительском компоненте, поскольку у вас там есть триггер.Затем передайте его как реквизит модальному компоненту.Вот фиксированный код для вас: 

  import React, { Component } from 'react';
  import AddModal from './addmodal';

  class Page extends Component {
    constructor(){
      super();
      this.state = { isModalOpen: false };
    }
    ...//skip
    handleAdd= () =>{
      this.setState({ isModalOpen: true });
    }
    render(){
      return (
        <div>
          <button onClick={this.handleAdd} > Add </button>
          <AddModal isOpen={this.state.isModalOpen} />
        </div>
        )
    }
  }


  import React, { Component } from 'react';

  class AddModal extends Component {
    // ... skip
    render(){
      return(
        <modal inOpen={this.props.isOpen} >
          ...//skip
        </modal>
      )
    }
  }

  export default AddModal;
...