如何在react/storybook中正确使用外部状态
提问于 2017-10-18 08:51:38
我正在使用强大的storybook/react，但我遇到了一个问题。
我有很多依赖于道具(无状态)的组件，所以在我的真实应用程序中，我有保持状态的容器组件。
例如，我有一个<Toggle />，您可以看到here从它的父级获取值，并从它的属性调用onChange来更改它。我想把这个行为写进我的故事书中，但不知道怎么做：
storiesOf('Toggle', module).add('', () => (
<Toggle name="toggle" checked={/* what here ? */} onChange={/* what here ? */} />
))
回答 1
Stack Overflow用户
发布于 2018-08-14 18:26:18
您可以使用一个故事书状态插件，就像我不久前发布的这个https://www.npmjs.com/package/@sambego/storybook-state
您的代码可能如下所示，其中checked属性将自动从存储区传递，而onChange方法将更新存储区。
const store = new Store({
checked: true,
});
storiesOf('Toggle', module)
.addDecorator(StateDecorator(store))
.add('', () => (
<Toggle name="toggle" onChange={() => store.set({checked: store.get('checked')})} />
))页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46806221
复制
腾讯云开发者
