将值传递给 Storybook 中的嵌套组件

Question

有没有更好的方法将值传递给 Storybook 中的嵌套组件？我可以明确说明每个单独的值，但这似乎效率很低。

function Dropdown({ label, type, size, title, disabled }) {
    return (
    <div className="dropdown">
        <Button
            label={label}
            type={type}
            size={size}
            title={title}
            disabled={disabled}
        />
    </div>
)}

有没有办法一次传递所有值？

dropdown.stories.js

export const DropdownButton = Template.bind({});
DropdownButton.args = {
    label: "Dropdown label",
    type: "btn-primary dropdown-toggle",
    size: "btn-sm",
    title: "",
    disabled: false,
}

Answer 1

您可以使用 spread 运算符：

function Dropdown(props) {
    return (
    <div className="dropdown">
        <Button {...props} />
    </div>
)}

将值传递给 Storybook 中的嵌套组件

Passing values to a nested component in Storybook

reactjs

storybook