Javascript 反应索引键在映射中不起作用

Javascript 反应索引键在映射中不起作用,javascript,reactjs,list,ecmascript-6,jsx,Javascript,Reactjs,List,Ecmascript 6,Jsx,我使用了index键,但它仍然显示错误。还尝试使用JSON数据中的唯一id,但无法解决此问题 错误 警告:列表中的每个孩子都应该有一个唯一的“键”道具 const faqdata=this.props.faqdata.map((faq,索引)=>( {faq.description} )); 警告:列表中的每个子项都应具有唯一的“键””道具 只有当列表中的两个或多个项目提供了相同的键时,您才会收到此警告,您的代码对我来说很好,它不应该发出此警告,请使用映射中的console.log(ind

我使用了
index
键,但它仍然显示错误。还尝试使用JSON数据中的唯一id,但无法解决此问题

错误

警告:列表中的每个孩子都应该有一个唯一的“键”道具

const faqdata=this.props.faqdata.map((faq,索引)=>(
  • {faq.description}
  • ));
    警告:列表中的每个子项都应具有唯一的“键””道具

    只有当列表中的两个或多个项目提供了相同的键时,您才会收到此警告,您的代码对我来说很好,它不应该发出此
    警告
    ,请使用
    映射中的console.log(index)尝试

    const faqdata = this.props.faqData.map((faq, index) => {
        console.log(index);
        <li key={index}>
                {faq.description}
        </li>
    });
    
    const faqdata=this.props.faqdata.map((faq,索引)=>{
    控制台日志(索引);
    
  • {faq.description}
  • });
    反模式:

    您不应该使用地图的索引键,这是一种反模式, 它可能导致不可预测的结果

    请检查这个

    您应该为您的键使用适当的唯一id,如DB id或某个唯一id


    该键在内部用于标识要渲染和不再渲染的DOM元素

    您必须使用ID、非重复名称(或任何您称之为唯一的名称)但不能使用其索引,因为它通过其键:值对将VDOM与其他答案进行比较

    回顾时引用不应将数组索引用作键,因为它是反模式,它仍将解决警告

    你所做的是正确的,应该删除警告。尽管我怀疑当您再次迭代您的
    faqdata
    的结果时会出现警告

    每次渲染数组中的内容时,每个条目都应该具有key属性。

    和的可能重复项
    const faqdata = this.props.faqData.map((faq, index) => {
        console.log(index);
        <li key={index}>
                {faq.description}
        </li>
    });