ストーリーブックのコンポーネントの小道具を更新するには

Question

私は孤立して私のコンポーネントで遊ぶためにstorybook（this）を使用しています。私はすべてのフラックスサイクルをモックしたい（フルアプリではreduxの助けを借りて行われます）、物語の単純なオブジェクトを使ってプロパティを更新したいのですが、何か不足しています。

storiesOf('Color picker', module).add('base',() => { 
    let colorPickerState = { 
     changeColor: function(data) { 
     this.color = data.color 
     }, 
     color: '#00aced' 
    } 
    return (
     <ColorPicker 
     name="color" 
     onChange={colorPickerState.changeColor.bind(colorPickerState)} 
     value={colorPickerState.color} 
     /> 
    ) 
    } 

私はonChangeが呼び出されたとき<ColorPicker />のvalue小道具が更新されることを期待。 colorPickerState.colorの値は正しく更新されていますが、コンポーネントは再レンダリングされません。

私には何が欠けていますか？

あなたがこれを達成するためにアドオンを使用することができます

Answer 1

：

import { State, Store } from '@sambego/storybook-state'; 

const store = new Store({ 
    value: '#00aced', 
}); 

storiesOf('Color picker', module).add('base',() => { 
    return (
    <State store={store}> 
     <ColorPicker 
     name="color" 
     onChange={(data) => store.set({ value: data.color })} 
     /> 
    </State> 
) 
} 

：だからあなたのコードは次のようになり https://github.com/Sambego/storybook-state

を