你如何在反应中设置一个组件与不同组件的状态？

Question

我有一个组件不会像这样渲染任何东西：

var Application = react.createClass .....

function(....)

module.exports = Application

还有一个像这样的组件：

var Tag = react.createClass....
  getInitialState
  //...
  functions
  //...
  setState({ submit: false })
  render: 
  //...

我想从 Application 更改 Tag 中的提交状态。这可能吗？

Answer 1

虽然可以从应用程序更改标签的状态，但您确实不应该这样做。此外，我讨厌这些类型的答案，因为我不应该告诉你 bad vs.好的做法，我应该给你你所寻求的答案。

这就是我的做法。

如果您需要从应用程序中设置标签的状态，您可以做 2 件事之一：

A. 在应用程序上调用 setState，并将特定的道具传递给标签，您将检查是否应该设置状态。您可以在标签的componentWillReceiveProps 中查看这一点。根据收到的道具，您可以设置状态。请注意，componentWillReceiveProps 不会在 componentDidMount 运行时运行，因此您可能需要通过在 componentDidMount 末尾执行类似操作来强制它运行：

componentDidMount: function() {

    //other code...

    if (this.props.forceReceiveProps === true) {
        this.componentWillReceiveProps(this.props);
    }
}

B.实现此目的的另一种方法是使用应用程序中标记的引用。

在应用程序中，您将渲染一些可能有标签的东西。做这样的事情：

<Tags ref=tagsRef />

然后，在应用程序的一些代码中，您可以这样做：

this.refs.tagsRef.setState({})

编辑：实际上，在重读时，您似乎没有在 Application.我认为它是您整个应用程序的父级。不知道你为什么不在应用程序中渲染，但可以说你可能想要使用 Flux 之类的东西。