Storybook: Configurar ações para fazer a transição para uma história diferente?

Criado em 5 abr. 2016 · 3Comentários · Fonte: storybookjs/storybook

Seria bom se uma ação pudesse desencadear uma transição para uma história diferente para simular interatividade, semelhante a como você pode criar protótipos simples com Invision, Framer.js, etc.

Por exemplo, digamos que você tenha um widget "Alternar" com dois estados, "ligado" e "desligado", seria bom se você pudesse configurar as ações de cada história para alternar para outra história para simular a alternância realmente ocorrendo:

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

Fonte

tlrobinson

👍2

Comentários muito úteis

Podemos fazer assim:

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')} />
  });

Eu acho que essa API parece ótima.

arunoda em 5 abr. 2016

👍4

Todos 3 comentários

Uau. Isso é um recurso legal.

arunoda em 5 abr. 2016

Podemos fazer assim:

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')} />
  });

Eu acho que essa API parece ótima.

arunoda em 5 abr. 2016

👍4

Graças ao PR #86 de @jeef3 , agora temos a funcionalidade de vinculação de histórias.
Lançado com v1.8.0 .

arunoda em 9 abr. 2016

Esta página foi útil?

0 / 5 - 0 avaliações