react key值警告问题

没有warning

第一种情况

1. function(name,index)
2. return div标签带有属性key={index}

//Component1.jsx
import React from 'react';


var names = ['Alice', 'Emily', 'Kate'];

class Component1 extends React.Component {
    render() {
        return (
            <div>
            {
                names.map(function(name,index){
                   return <div key={index}>Hello, {name}!</div>
                })
            }
            </div>
        )
    }
}

//导出组件
export default Component1;

第二种情况

//Component1.jsx
import React from 'react';


var arr = [
  <h1>Hello world!</h1>,
  <h2>React is awesome!</h2>,
];

class Component1 extends React.Component {
    render() {
        return (
            <div>
            {
                arr.map(function(ele,index){
                   return <div key={index}>{ele}</div>
                })
            }
            </div>
        )
    }
}

//导出组件
export default Component1;

转载于:https://www.cnblogs.com/sakura-sakura/p/6678737.html