Как передать параметр state в другой компонент?

Question

[Валерий Петров]

Есть кнопка, нажимая на которую происходит присваивание значения к свойству visible

class Func1 extends Component {
    constructor(props) {
        super(props);
       
        this.state = {
            visible: false 
        }

        openForm = (event) => {
        this.setState({
            visible: true    /* <= присвоили true*/
        });
    }

    }
}

Вот сюда нужно передать это значение

class Func2 extends Component {
    constructor(props) {
        super(props);
       
        this.state = {
            visible:  /* вот сюда */
        }

    }
}

Answer 1

[Антон Спирин]

Можно сделать так:

class FormWidget extends Component {
  state={
    isFormVisible: false,
  };

  handleButtonClick = () => {
    this.setState(prevState => ({
      isFormVisible: !prevState.isFormVisible,
    }));
  }

  render() {
    const { isFormVisible } = this.state;
    const buttonText = isFormVisible ? 'Hide form' : 'Show form';

    return (
      <Wrapper>
        <Button onClick={this.handleButtonClick}>
          {buttonText}
        </Button>
        <Form isVisible={isFormVisible} />
      </Wrapper>
    )
  }
}

state из кнопки и формы следует убрать.
Конструкторы в react использовать не надо.

Comments

[Валерий Петров]

Спасибо, решение верное, я уже решил проблему, похожим способом:)

Answer 2

[Олег Гамега]

просто прокиньте в пропсы

...
<Funck2 visible = {this.state.visible}/>
...

Comments

[Валерий Петров]

Так тоже можно, но нужно было немного не так;) Спасибо за ответ!