在 Vue 中传递 SEO 友好的标题而不是 ID 号

Question

我正在使用 vuejs 和 vue router，我正在使用 axios 根据我在 router/index.js 文件中设置的路由向 API 发出 get 请求。

但是我想传递 SEO 友好的标题而不是 id。

myname/products/bears 而不是myname/products/1

路线

   {
        path: '/products/:id',
        name: 'productDetail',
        props: true,
        component: function () {
            return import('../views/products/mycomponent')
        }
    },

方法

getProduct(){
            var itemId = this.$route.params.id;
            //return console.log(itemId)
            axios
            .get('http://localhost:3000/products/'+itemId)
            .then(response => (
                this.server = response.data
            ))
        },

Answer 1

要回答您的问题，我认为这更多的是数据问题？如果您的 id 是 bears，它将按您的意愿工作。如果您提供名称 bears 的字段也是唯一的，您可以使用它来代替 url 中的 id。

附带说明：VueJS 本身无法提供对 SEO 友好的元数据，您可能需要考虑使用 Gridsome 或 Nuxt 之类的东西。