Storybook: 다른 스토리로 전환하기 위한 작업을 구성하시겠습니까?

에 만든 2016년 04월 05일 · 3코멘트 · 출처: storybookjs/storybook

Invision, Framer.js 등을 사용하여 간단한 프로토타입을 만드는 방법과 유사하게 상호 작용을 시뮬레이션하기 위해 작업이 다른 스토리로의 전환을 트리거할 수 있다면 좋을 것입니다.

예를 들어 "켜기"와 "끄기"의 두 가지 상태를 가진 "토글" 위젯이 있다고 가정해 보겠습니다. 각 스토리에 대한 작업을 설정하여 실제로 발생하는 토글을 시뮬레이션할 수 있다면 좋을 것입니다.

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 등급