React渲染列表时，已经加了key，确还提示没有添加key属性
如图，我递归渲染一个多级菜单组件，我在每个li中已经添加了key属性，devtools中也显示每个li都有key，但是仍然报错，请问如何解决
（我尝试把代码<li key={menuItem._id}>{vdom}</li>中的{vdom}删除了就不报错了，这时因为底层会把数组对象做遍历处理吗？有什么方案可以解决此问题）
// 父组件中传入的列表[
{
_id: 1,
name: '首页',
to: '/'
},
{
_id: 2,
name: '分类',
children: [
{
_id: 3,
name: '分类1',
to: '/cate1'
},
{
_id: 4,
name: '分类2',
to: '/cate2'
}
]
},
{
_id: 5,
name: '关于',
to: '/about'
}
]
// Menu组件export default class Menu extends Component {
static propTypes = {
list: PropTypes.array.isRequired
}
renderMenu = menuList => {
return (
<ul className="menu">
{
menuList.map(menuItem => {
const vdom = []
if (menuItem.to) {
vdom.push(
<NavLink className="menu-item" to={menuItem.to}>
<span>{menuItem.name}</span>
</NavLink>
)
} else {
vdom.push(
<a href="#!" className="menu-item">
<span>{menuItem.name}</span>
</a>
)
}
if (menuItem.children) {
vdom.push(this.renderMenu(menuItem.children))
}
return <li key={menuItem._id}>{vdom}</li>
})
}
</ul>
)
}
render () {
return this.renderMenu(this.props.list)
}
}
回答
<NavLink/>和<a/>也需要加key吧
以上是 React渲染列表时，已经加了key，确还提示没有添加key属性 的全部内容， 来源链接： utcz.com/a/39740.html
