React JS 中的列表和键问题

Question

在上 React 课程时，对我必须解决的问题之一感到困惑。我必须在之后{list &&和之前完成代码，以便映射它

• 以便显示每个提示。我对设置地图功能和正确设置密钥感到困惑。

  import React, { useState, useEffect } from 'react';
  import './Tips.css';
  
  function Tips() {
    useEffect(() => {
      fetch('api').then((res) => {
        return res.json();
      }).then((res) => {
        setList(Object.values(res));  
      })
    }, []);
    const [list, setList] = useState();
    return (
      <div className="tips">
        <ul className="tips__list">
        {list &&  tips.map((item.tip) =>
           return (
            <li key={item.tip} className="tips__item">{item.tip}</li>
          );
        )}
        </ul>
      </div>
    );
  }
  
  export default Tips;
  
  

Answer 1

你.map()应该在你的列表变量中被调用。

 return (
    <div className="tips">
      <ul className="tips__list">
        {list &&
          list.map((item) => 
            <li key={item.tip} className="tips__item">
              {item.tip}
            </li>
          )}
      </ul>
    </div>
  );