react，获取数据后使用List列表显示出来，列表项共有1220条但只显示出20条？

Question

在使用的react版本如下：

已写的代码：

function HouseList() {
    const [list, setList] = useState([])
    const searchHouseList = (value) => {
          API.get('/houses', {
      params: {
        cityId: value,
        ...filters
      }
    }).then(res=>{
    const { list, count } = res.data.body
    setList(list)
    }
  function renderList() {
        return (
      // <>
      <List>
        {list.map((item) => (
          <List.Item 
            key={item.desc}
            prefix={<Image src={BASE_URL + item.houseImg} style={{ borderRadius: 0 }} fit='cover' width={80} height={80}/>} 
            title={item.title}
            description={item.price + '元/月'} 
            onClick={()=>navigate(`/detail/${item.houseCode}`)}
            arrow={false}>
              <div className={styles.desc}>{item.desc}</div>
              <div className={styles.tags}>
                {item.tags.map((tag, index) => {
                  const tagClass = 'tag' + (index + 1)
                  return (
                    <span
                      className={[styles.tag, styles[tagClass]].join(' ')}
                      key={tag}
                    >
                      {tag}
                    </span>
                  )
                })}
              </div>
          </List.Item>
        ))}
      </List>
      // </>
    )
  }
  return (
    <div className={styles.houseItems}>{renderList()}</div>
  ）
}

目前的效果是，在后台看到获取到的列表项有1220个，然而界面显示的列表项只有20个

请问代码里有哪些地方写得不对吗？正确的代码写法是什么？请展示代码举例说明。

Answer 1

可以跟踪一下响应，从后台返回的响应报文中看下响应体有多长大概就知道了。