Question

我遇到的问题似乎是axios在发布进行构建时会忽略我的GET路径，但在开发模式下可以正常工作。
我正在使用以下内容检索本地.html文件并将其解析为我的vue组件。

<template>
  <div>
    <div v-html="message"></div>
  </div>
</template>

<script>

import axios from 'axios';

export default {
  data () {
    return {
      message: '',
    }
  },
  async mounted(){
    const mypath = 'http://***.com/posts/' + this.$route.params.post + '.html';
    const ip = await this.$axios.$get(mypath);
    this.message = ip;
  }
}
</script>

此.vue位于“页面/博客/帖子/_post.vue”
我的.html文件位于“ static / posts / examplepost.html”中

以开发人员模式运行时，如果我将路径的第一部分更改为“ http://localhost:3000/posts/”或仅更改为“ / posts /”，则一切正常。
但是，当我发布到Web并链接到博客文章url时，会在以下路径中得到404："https://***.com/blogs/posts/examplepost.html"
为什么这在开发人员模式下有效，但在构建时却无法正常工作？

我尝试将帖子移到“ / blogs / posts /”位置，并尝试创建axios的新实例并直接在组件中设置baseURL并获得相同的结果。

Answer 1

发现了问题。
问题是我正在使用<a>来创建指向由“ _post.vue”创建的各个页面的链接

<a :href="'posts/' + blog.link">

使用<nuxt-link>（就像在任何地方都建议使用的那样）解决了以下问题：

<nuxt-link :to="'posts/' + blog.link">

无法在nuxt中使用axios从正确的位置获取

1 个答案: