V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
fangwenxue
V2EX  ›  问与答

react 如何定时刷新组件

  •  
  •   fangwenxue · 2021-12-17 11:16:35 +08:00 · 1334 次点击
    这是一个创建于 1072 天前的主题,其中的信息可能已经有所发展或是发生改变。
    const Posts = () => {
      const [posts, setPosts] = useState([]);
    
      useEffect(() => {
        const getPosts = async () => {
          const resp = await fetch(API);
          const postsResp = await resp.json();
          setPosts(postsResp);
        };
    
        getPosts();
      }, []);
    
      return '';
    };
    
    export default Posts;
    

    如何定时刷新 posts 的数据?

    4 条回复    2021-12-17 18:15:58 +08:00
    noe132
        1
    noe132  
       2021-12-17 11:37:19 +08:00
    setTimeout / setInterval
    mx8Y3o5w3M70LC4y
        2
    mx8Y3o5w3M70LC4y  
       2021-12-17 13:11:10 +08:00 via Android
    你这个 getposts 如果其他地方没用到,是不需要定义的,直接 async()=>{...}()
    br_wang
        3
    br_wang  
       2021-12-17 17:44:48 +08:00
    1. 定义一个 state ,比如 refreshCount;
    2. refreshCount 并声明为 effect 的依赖,利用 setRefreshCount 变更 refreshCount 值触发 effect 重新执行;
    3. 可以 setTimeout 或 setInterval ,周期性调用 setRefreshCount 实现刷新;
    4. 也可以把 setRefreshCount 绑到按钮上,手动触发刷新;
    5. 注意竞速问题。
    baolinliu442k
        4
    baolinliu442k  
       2021-12-17 18:15:58 +08:00
    setTimeOut(()->{
    getPosts();
    }, time)
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1265 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 18:01 · PVG 02:01 · LAX 10:01 · JFK 13:01
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.