Question

map方法采用了我已经理解的回调函数。通常你会将函数放在map：

中

const todoItems = todos.map((todo) =>
  <li key={todo.id}>
    {todo.text}
  </li>
);

但在我的项目中，我将该函数称为单独的组件：

{ tabs.map( myFunction ) }

这是myFunction组件：

const myFunction = (item) => {

    return(

        <Thing 
            key={item.value}
            label={item.label}
            value={item.value} 
        />
    );
}

地图中的“项目”似乎会自动传递。

问题是我需要传递一个额外的变量 - 我该怎么做？这不起作用：

{ tabs.map( myFunction(myvariable) ) }

也不：

{ tabs.map((styles) => myFunction ) }

所以我不确定如何传递变量..并且仍然可以传递“item”。

Answer 1

解决方案是：

{ tabs.map((tab) => myFunction(tab, myvariable)) }

另请注意

const myFunction = (item) => {

    return(

        <Thing 
            key={item.value}
            label={item.label}
            value={item.value} 
        />
    );
}

可以重构为

const myFunction = (item) => (
        <Thing 
            key={item.value}
            label={item.label}
            value={item.value} 
        />
);

react map方法 - 分别放回调函数并发送参数

1 个答案: