使用Storybook插件旋钮,如何调整虚拟数据?

时间:2018-04-27 21:31:44

标签: reactjs storybook

在我的React故事书中,我使用了旋钮,我想为虚拟数据添加一个旋钮。这是我的故事书组件示例:

import React from 'react';
import { boolean } from '@storybook/addon-knobs/react';
import { MySteps } from '../../src/components/index';

const steps = [
  {
    completed: true,
    title: 'xxxxxxx',
  },
  {
    completed: false,
    title: 'x',
  },
];

export default () => (
  <div>
    <MySteps
       steps={steps}
    />
  </div>
);

我想添加一个这样的旋钮:

export default () => (
  <GettingStartedSteps
    step_1_completed={boolean('Step 1 Completed', true)}
    step_2_completed={boolean('Step 2 Completed', false)}
    steps={steps}
  />
);

这个动态虚拟数据是否可以使用Storybook +旋钮?

0 个答案:

没有答案