获取react-bootstrap-switch

Question

我正在使用react-bootstrap-switch在我正在构建的反应应用中，并且无法获得切换状态。

这就是我渲染开关的方式：

<Switch value={'off'} state={this.state.storyStatus} size={'small'} onColor={'danger'} onChange={this.handleChange}/>

我已经将它用于更改处理程序：

handleChange: function () {
      console.log(this.state);
      //this.setState({storyStatus: !this.state});
  },

这是我的初始状态方法：

getInitialState: function() {
    return {
        storyStatus: "false"
    };
  },

console.log只记录初始状态，而不是交换机的实际状态。

使用反应开发工具我可以看到操作开关时状态发生变化，但似乎无法拉动开关状态的值。

最终我想根据开关的状态更改li元素的背景颜色。

Answer 1

请注意，Switch是在父组件上定义的，它会呈现您的this.state组件。这就是为什么Switch引用此父组件的状态而不是getInitialState组件的状态的原因。

同样，storyStatus: "false"定义了父组件的初始状态，我们唯一定义的是Switch。

要从onChange组件中读取值，handleChange(component, state) { console.log(state); } 回调可让您访问组件和状态（source）。

这样做

{{1}}

应该这样做。