Storybook: 別のストーリーに移行するためのアクションを構成しますか？

作成日 2016年04月05日 · 3コメント · ソース: storybookjs/storybook

Invision、Framer.jsなどを使用して単純なプロトタイプを作成する方法と同様に、アクションがインタラクティブ性をシミュレートするために別のストーリーへの移行をトリガーできると便利です。

たとえば、「オン」と「オフ」の2つの状態を持つ「トグル」ウィジェットがある場合、実際に発生するトグルをシミュレートするために、各ストーリーのアクションを設定して別のストーリーに切り替えることができれば便利です。

storiesOf('Toggle', module)
  .add('on', () => {
    return <Toggle value={true} onChange={action('onChange', 'off')} />
  })
  .add('off', () => {
    return <Toggle value={false} onChange={action('onChange', 'on')} />
  });

feature request

ソース

tlrobinson

👍2

最も参考になるコメント

私たちはこのようにそれを行うことができます：

import { linkTo } from @kadira/storybook

storiesOf('Toggle', module)
  .add('on', () => {
    return <Toggle value={true} onChange={linkTo('Toggle', 'off')} />
  })
  .add('off', () => {
    return <Toggle value={false} onChange={linkTo('Toggle', 'on')} />
  });

このAPIは素晴らしいと思います。

arunoda 2016年04月05日

👍4

全てのコメント3件

おお。それはクールな機能です。

arunoda 2016年04月05日

私たちはこのようにそれを行うことができます：

import { linkTo } from @kadira/storybook

storiesOf('Toggle', module)
  .add('on', () => {
    return <Toggle value={true} onChange={linkTo('Toggle', 'off')} />
  })
  .add('off', () => {
    return <Toggle value={false} onChange={linkTo('Toggle', 'on')} />
  });

このAPIは素晴らしいと思います。

arunoda 2016年04月05日

👍4

@ jeef3のPR＃86のおかげで、ストーリーリンク機能ができました。
v1.8.0でリリースされました。

arunoda 2016年04月09日

このページは役に立ちましたか？

0 / 5 - 0 評価