Question

我正在建造一个下游 b。

在目前的博客布局中,我通过使用效应/fetch(因为只用页页处理)在我的侧厅上收集了数据(我需要显示我的“重要职位”),但每页之间的路段,都会触发数据。 (一) 空白处,并重载职位头衔)

是否有办法在最初的负荷后消除这种行为,并造成一种固定或冷静? 我使用了“[]”方法,但至今没有uck子:

  const [posts, setPosts] = useState([])

  useEffect(()=>{
    const fetchData = async () => {
      const res = await fetch( /api/posts );
      const {data} = await res.json();
      setPosts(data)
    }
    fetchData()
  }, []);

还是有更好的办法在我的侧厅收集数据? 这是我设法使之发挥作用的唯一解决办法,但它是半工作。

Answer 1

import { useState, useEffect } from  react 


export default function RightBar() {

  const [posts, setPosts] = useState([])

  useEffect(()=>{
    const fetchData = async () => {
      const res = await fetch( /api/posts );
      const {data} = await res.json();
      setPosts(data)
    }
    fetchData()
  }, []);


    return (
      <div className="rightbar content">
        <div className="rightbarContent">
          <h3 className="sidebarborder"><span className="sidebarheader">Recent Posts</span></h3>
          {posts.slice(0,5).map(posts => {
              return (
                <div key={posts._id}>
                    * <Link href={`/${posts._id}`}>{posts.title}</Link>
                </div>
              )
          })}
          <h3>Categories</h3>
          <p>blabla</p>
        </div>      
      </div>
    )
  }

The component layout is this:

Layout > Header Topnav Mainfooter

Main has 2 children > LeftBar (where my main content resides) and RightBar (where I show my recent posts)

Layout总结了索引页。因此,我转授了孩子们的主食;左侧部分。

我希望这一解释是充分的。

友情链接