在 Storybook React 中嵌套数组

发布于 2025-01-09 09:10:46 字数 661 浏览 0 评论 0原文

我正在努力将值传递给 Storybook js 中的嵌套数组。写这个的正确方法是什么?

组成部分:

{options.map(item => {
    return <div id={item.id}>
            <div>…</div>
            <div className="ml-2">
                {actions.map(subitem => {
                    return <Button
                            id={subitem.id}
                        />
                })}
            </div>
    </div>
})}

故事:

Basics.args = {
    options: [
        {
            id: 'a',
            actions: [
                {
                  id: ‘b’,
                },
            ]
        },

I'm struggling to pass values to my nested array in Storybook js. What's the proper way to write this?

The component:

{options.map(item => {
    return <div id={item.id}>
            <div>…</div>
            <div className="ml-2">
                {actions.map(subitem => {
                    return <Button
                            id={subitem.id}
                        />
                })}
            </div>
    </div>
})}

The story:

Basics.args = {
    options: [
        {
            id: 'a',
            actions: [
                {
                  id: ‘b’,
                },
            ]
        },

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

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

发布评论

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

评论(1

甜柠檬 2025-01-16 09:10:46

您的代码中未定义 actions 。由于 actions 是您应该使用的 item 对象的属性,因此

item.actions.map 

我附上了一个代码片段供您参考。

  const arr = {
   options: [
        {
            id: 'a',
            actions: [
                {
                  id: 'b',
                },
            ]
        } ]
  }

arr.options.map(item=> item.actions.map(subitem => console.log(subitem.id)))

actions is not defined in your code. Since actions is a property of the item object you should use

item.actions.map 

I have attached a code snippet for your reference.

  const arr = {
   options: [
        {
            id: 'a',
            actions: [
                {
                  id: 'b',
                },
            ]
        } ]
  }

arr.options.map(item=> item.actions.map(subitem => console.log(subitem.id)))

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文