Json 服务器数据在反应中未正确获取

问题描述

我尝试从本地 json 服务器获取数据。

const {data,pending,error} = useFetch('http://localhost:8000/blogs');

这可以正常工作。但我试图获取博客中的数据，

const { data: blog,error,pending} = UseFetch(http://localhost:8000/blogs/${id});

此代码段无法正常工作。当我运行此代码时，它会像这样运行。此服务器地址无效。

http://localhost:3000/blogs/%201 地址末尾是“%201”。但我的内容“id=1”。

当我输入地址 http://localhost:3000/blogs/1 时，我的代码正在运行。

我正在寻求帮助。检查我的 Repository

解决方法

删除 to="/pathname" 中的空格

 <Link to={`/blogs/ ${blogs.id} `}>
     <h2 className='header'>{ blogs.title }</h2>
          <p>Written by { blogs.author } </p>
  </Link>

为此

<Link to={`/blogs/${blogs.id}`}>
     <h2 className='header'>{ blogs.title }</h2>
          <p>Written by { blogs.author } </p>
  </Link>

,

Fetch 尝试对 api 地址中的某些字符进行转义，因此 encodeURI(' 1') 将是 '%201'。

检查 blog.id 的值，应该是数字，而不是字符串。