Javascript 使用React增加select中的值

我想增加页面nr时，我的滚动选择将在底部。
演示：

const scroll=（e）=>{
设page=1；
e、 坚持（）；
常数{target}=e；
if（target.scrollTop+target.offsetHeight===target.scrollHeight）{
页码+=1；
控制台日志（第页）；
取回（“https://randomuser.me/api/?results=“+页）
.then（（response）=>response.json（））
。然后（（正文）=>{
控制台日志（主体）；
});
}
};在您的代码中，页面变量总是从1开始，因此我认为您需要在组件中有一个状态，以便像这样保存页面变量

const [page, setPage] = useState(1)

const scroll = (e) => {
  e.persist();
  const { target } = e;
  if (target.scrollTop + target.offsetHeight === target.scrollHeight) {
    setPage(prev => prev + 1)
    console.log(page);
    fetch("https://randomuser.me/api/?results=" + page)
      .then((response) => response.json())
      .then((body) => {
        console.log(body);
      });
  }
};

在函数外部初始化变量
试试这个：

  let page = 1; // initialise variable outside the function
  const scroll = (e) => {
  e.persist();
  const { target } = e;
  if (target.scrollTop + target.offsetHeight === target.scrollHeight) {
    page += 1;
    console.log(page);
    fetch("https://randomuser.me/api/?results=" + page)
      .then((response) => response.json())
      .then((body) => {
        console.log(body);
      });
  }
};

正确的方法是在本地状态下移动
page
变量，当滚动到达末尾增加页面时，让
useffect
处理新数据的获取

假设您使用的是react钩子

import React，{useCallback，useffect，useState}来自“React”；
constyourcomponent=（）=>{
const[page，setPage]=useState（1）；
const[isFetching，setIsFetching]=useState（false）；
const scroll=useCallback(({
目标
}) => {
如果（正在提取）返回；
if（target.scrollTop+target.offsetHeight===target.scrollHeight）{
设置页面（prevPage=>prevPage+1）；
}
}，[isFetching]）；
useffect（（）=>{
取回（“https://randomuser.me/api/?results=“+页）
.then（（response）=>response.json（））
。然后（（正文）=>{
控制台日志（主体）；
});
}，[第页]）
在此处返回//渲染代码
}
每次滚动弹出窗口时，您都会调用滚动功能：因此，它只需将页面重置为1并在底部添加1，控制台每次打印2

您必须将页面保存到一个状态。但是，由于setState方法是异步的，因此需要将数据提取到useEffect挂钩中：

useEffect(() => {
    fetch("https://randomuser.me/api/?results=" + page)
      .then((response) => response.json())
      .then((body) => {
        console.log(body);
      });
  },[page]);

每次更新页面状态时，都会执行此挂钩

顺便说一下，尝试使用ref而不是vanilla document.getElementById（）来获取滚动高度the
let page=1
需要在
scroll
方法之外，因为现在每次调用
scroll
方法时都会重置它。可能处于组件
状态
？您还应该使用一个标志来设置和检查您当前是否正在获取下一页，这样您就不会重新发出更多的
fetch
请求。这将使用
page
的上一个值发出fetch，因为
setPage
是异步的。然后您可以通过setPage增加页面状态，并在fetch函数中使用page+1。