react，页面没有按照Picker所选的条件进行数据的筛选和显示？

在使用的react版本如下：

function HouseList() {
  const [list, setList] = useState([])
  const [count, setCount] = useState(0)
  const [isLoading, setIsLoading] = useState(false)
  const searchHouseList = (value) => {
    setIsLoading(true)

    API.get('/houses', {
      params: {
        cityId: value,
        ...filters,
        start: 1,
        end: 20
      }
    }).then(res=>{
    const { list, count } = res.data.body

    setList(list)
    setCount(count)
    setIsLoading(false)
    })
  }

  // 渲染房屋列表项
  function renderHouseList ({ key, index, style }) {
    const house = list[index]
    
    return (
      <HouseItem
        key={key}
        onClick={() => navigate(`/detail/${house.houseCode}`)}
        style={style}
        src={BASE_URL + house.houseImg}
        title={house.title}
        desc={house.desc}
        tags={house.tags}
        price={house.price}
      />
    )
  }

  const isRowLoaded = ({ index }) => {
    return !!list[index]
  }

  const loadMoreRows = ({ startIndex, stopIndex }) => {
    return new Promise(resolve => {
      API.get('/houses', {
        params: {
          cityId: value,
          ...filters,
          start: startIndex,
          end: stopIndex
        }
      }).then(res => {
        setList([...list, ...res.data.body.list])
        resolve()
      })
    })
  }

  // 渲染列表数据
  function renderList() {
    return (
      <InfiniteLoader
        isRowLoaded={isRowLoaded}
        loadMoreRows={loadMoreRows}
        rowCount={count}
      >
        {({ onRowsRendered, registerChild }) => (
          <WindowScroller>
            {({ height, isScrolling, scrollTop }) => (
              <AutoSizer>
                {({ width }) => (
                  <List
                    onRowsRendered={onRowsRendered}
                    ref={registerChild}
                    autoHeight // 设置高度为 WindowScroller 最终渲染的列表高度
                    width={width} // 视口的宽度
                    height={height} // 视口的高度
                    rowCount={count} // List列表项的行数
                    rowHeight={120} // 每一行的高度
                    rowRenderer={renderHouseList} // 渲染列表项中的每一行
                    isScrolling={isScrolling}
                    scrollTop={scrollTop}
                  />
                )}
              AutoSizer>
            )}
          WindowScroller>
        )}
      InfiniteLoader>
    )
  }

    return (
        <div className={styles.houseItems}>{renderList()}div>
    )
}

目前效果如下，首次进入该页面时自动显示出1689条数据
点击标题栏弹出相应的Picker模块，选择Picker模块里的其中一项后点击确定（例如点击租金项里的1000以下这个选项），显示出的数据没有按照Picker模块里的条件进行筛选，依然按初次渲染时一样获取到1689条数据：

此时，再次点击租金，选择里的1000以下选项后点击确定，计算出1067条数据，但显示出的内容没有按照Picker模块里的条件进行筛选，依然显示刚才的数据：

已排除数据库里的数据出错的情况，较大可能是前端代码存在写得不恰当的地方
请问代码有哪些地方写得不对？
如何修改才能实现如下效果：
不需要等到第二次，而只需第一次操作Picker模块选项后即可按条件筛选出正确的数据
请在现有代码的基础上展示代码举例说明

前端调试一下，看是否往后端发送了请求？