如何使用 Vuejs 加载 url

我正在建立一个包含几篇文章的网站。我正在使用 Vue Router，目前我的文章的 url 看起来像 /article/id，例如：http://localhost:8080/article/85.

如何在 URL 中添加文章标题，以便它可以http://localhost:8080/article/the-article-title例如 ？

我不知道应该提供什么样的代码，所以这是我的文章路线：

routes: [
 {
   path: '/article/:id',
   component: require('../components/articlePage.vue').default,
   name: 'article',
   meta: {title: "article"}
  }, 
]

如果 API 或数据库中不存在，首先在 JSON 对象中添加一个 slug

{
  id: 1,
  title: 'Jungle Book',
  slug: 'jungle-book',
  showDate: 'Monday',
  showTime: '19:10 - 20:55'
}

根据您的路径和组件更改路由器索引文件中的路径。 并且路径应该有“:slug”

 {
   path: '/movies/:slug',
   name: 'moviedetail',
   component: MovieDetail
}

在“router-link”中，在 v-for 之后添加 slug

<router-link :to="'/movies/' + movie.slug">

现在从您的组件获取数据

 data() {
   return {
      movie: this.$store.state.data,
      movieDetail: []
   }
 },

 methods: {
     getMovie(){
        this.movie.forEach(e => {
           if(e.slug == this.$route.params.slug){
              this.movieDetail = e;
           }
        });
      }
  },

  created() {
     this.getMovie();
  }