Nuxt如何请求本地API

我们在测试开发时，经常会遇到本地请求虚拟的数据，常见的有mock来模拟。Nuxt说一种简单的模拟本地API数据。

创建API

# Generates `server/api/links.ts`
npx nuxi add api links

会在server/api目录下创建文件。

在文件中编入一个json数据：

export default defineEventHandler((event) => {
  const links = [
    { title: 'A', url: 'https://A.cn/' },
    { title: 'B', url: 'https://B.net/' },
    { title: 'C', url: 'https://C.com/' },
    { title: 'D', url: 'https://D.com/' },
    { title: 'E', url: 'https://E.com/' }
  ];
  return links;
});

请求API

const { data: links } = await useFetch('/api/links')

使用useFetch即可请求本地API了。

参考文档

https://nuxt.com/docs/api/commands/add
https://nuxt.com/docs/getting-started/data-fetching#usefetch

文章版权归 有个狸 所有，未经许可不得转载，责任编辑：有个狸。