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’,
                },
            ]
        },

CodePudding user response：

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)))