vue.js - 在 Vue 中传递 SEO 友好的标题而不是 ID 号
问题描述
我正在使用vuejs
withvue 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
))
},
解决方案
要回答您的问题,我相信这更多的是数据问题?如果您的 id 是bears
,它将按您的意愿工作。如果您提供名称的字段bears
也是唯一的,您可以使用它代替 url 中的 id。
附带说明:VueJS 本身不能提供对 SEO 友好的元数据,您可能需要考虑使用 Gridsome 或 Nuxt 之类的东西。
推荐阅读
- php - 从现有表而不是从控制台生成实体
- ftp - 在 nixos 上运行 ftp 服务器
- android - Retrofit 中的 IllegalArgumentException / 不能有替换块 / Dynamic Url / Retrofit 2
- flutter - 如何从 Play 商店获取软件包名称和版本号?
- sql - 使用两个字段的条件在记录集上执行查找
- c# - 要列出的数据表
c#中没有for循环 - excel - 基于两列值的 VLOOKUP
- sql - 来自 2 个类似表的 2 个其他 SUM 的总和
- javascript - 如何增加椭圆的亮度
- javascript - 如何在OpenLayers中获取用户的当前位置以及经纬度