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

发布于 2025-01-11 03:10:47 字数 659 浏览 0 评论 0原文

有没有更好的方法将值传递给 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,
}

Is there a better way to pass values to a nested component in Storybook? I can explicitly state each individual value, but that seems very inefficient.

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

Is there a way to pass all the values at once?

dropdown.stories.js

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

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

把梦留给海 2025-01-18 03:10:47

您可以使用 传播 运算符:

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

You can use the spread operator:

function Dropdown(props) {
    return (
    <div className="dropdown">
        <Button {...props} />
    </div>
)}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文