[英]Storybook addon-knobs callback function knob
I have a situation in Storybook addon-knobs where I need a knob to change a callback function. 我在Storybook 附加旋钮中遇到一种情况,我需要一个旋钮来更改回调函数。
I want
formatValue
to be a knob but I am unsure how (and if) this can be done.我希望
formatValue
是一个旋钮,但是我不确定如何(以及是否可以)做到这一点。
import { storiesOf } from '@storybook/react';
import { withKnobs, boolean, text, number, object } from '@storybook/addon-knobs';
import storybookWrapper from '../../storybook/StorybookWrapper';
import Slider from './Slider';
stories.addDecorator(withKnobs)
.add('Slider', () => {
const props = {
name : 'foo',
value : number('value', 200000),
min : number('min', 100),
step : number('step', 1000),
max : number('max', 1000000),
// I want the below to be a knob:
formatValue : v => '$ ' + Number(v).toLocaleString(undefined, {maximumFractionDigits:2})
};
const WrappedComponent = storybookWrapper(Slider, props);
return <WrappedComponent />
}
);
Thanks! 谢谢!
For now I "solved" it like this: 现在,我像这样“解决”它:
(There is still no easy way to configure the toLocaleString()
part) (仍然没有简单的方法来配置
toLocaleString()
部分)
function formatValue(v) {
return text('prefix', '$ ') + Number(v).toLocaleString(undefined, {maximumFractionDigits:2}) + text('suffix', '')
}
const props = {
name : 'loanRequest',
value : number('value', 200000),
min : number('min', 100),
step : number('step', 1000),
max : number('max', 1000000),
formatValue
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.