在Reactjs中映射数组的对象

Question

我有一个对象，对象的每个键都有一个数组值

const correctionsWords  = {
"word": [ "1" , "2"] ,
"word2": ["20" ,"22" ] 
};

我使用以下代码映射了每个键

let correctionList =  Object.keys(correctionsWords).map(  (key)  => {
        return (
          <div>
              {
                  //console.log( 'After Mapping ' , correctionsWords[key]) [1,2,3]
                   <ul>
                     <li>{key} { /* word  */}
                      <ul> 
                        <li>{correctionsWords[key]}</li>
                      </ul>
                     </li>  
                     </ul>
              } 
          </div> 
        ); });

结果是* key：word * value：1 2如何列出数组的值？

Answer 1

再次映射每个数组元素：

<ul>
  {correctionsWords[key].map(el => (
    <li key={el}>{el}</li>
  ))}
</ul>

我在这里使用了key作为元素。如果元素不唯一，最好使用另一个键。此外，您需要在最顶层的div中对象映射的另一个键：

return (
    <div key={key}>
    ...

Answer 2

我认为你要找的是用以下内容替换最里面的li：

{
  correctionsWords[key].map(value => <li>{value}</li>)
}