Storybook: ¿Configurar acciones para la transición a una historia diferente?

Creado en 5 abr. 2016 · 3Comentarios · Fuente: storybookjs/storybook

Sería bueno si una acción pudiera desencadenar una transición a una historia diferente para simular la interactividad, de forma similar a cómo puede crear prototipos simples con Invision, Framer.js, etc.

Por ejemplo, supongamos que tiene un widget "Alternar" con dos estados, "encendido" y "apagado", sería bueno si pudiera configurar las acciones para que cada historia cambie a otra historia para simular la alternancia que realmente ocurre:

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

Fuente

tlrobinson

👍2

Comentario más útil

Podemos hacerlo así:

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

Creo que esta API se ve muy bien.

arunoda en 5 abr. 2016

👍4

Todos 3 comentarios

Guau. Esa es una característica genial.

arunoda en 5 abr. 2016

Podemos hacerlo así:

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

Creo que esta API se ve muy bien.

arunoda en 5 abr. 2016

👍4

Gracias al PR #86 de @jeef3 , ahora tenemos la funcionalidad de vinculación de historias.
Lanzado con v1.8.0 .

arunoda en 9 abr. 2016

¿Fue útil esta página

0 / 5 - 0 calificaciones