React JS 中的列表和键问题

在上 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;
    
    

你.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>
  );