在反应性无状态组件中切换子节点

Question

我使用的是有状态组件，但在使其成为无状态时，我不清楚如何/是否可以切换内部字段：

这里是一个人为的例子。实际上，我正在使用react-redux-form，并且需要根据某些收音机切换某些输入字段。

const Sample = (props) => {

  let show = true
  const toggleMethod = (model, value) => {
    show = !show
  }

  return (
    <div>
      <Control changeAction={toggleMethod} />
      { show === 'cc' ? <CCFIelds /> : null }

    </div>
    )
}

切换方法工作的很好，但它不会重发。我是否有义务使用状态来实现这一点，还是有办法做到这一点呢？

Answer 1

当@Jason说您可以发送到更改状态时，这是一种影响父级并导致重发的方法，但您不必重做。

最简单的方法是让父(智能容器)拥有和控制show变量，然后作为支柱传递给您的无状态组件。在父级中定义toggleMethod()，并将其传递下去。

概括地说：

1. show在父母中切换
2. prop变化
3. 无状态组件重选器