vue实现修改功能,

　　本文主要介绍vue如何动态修改meta的标题，有很好的参考价值。希望对你有帮助。如有错误或不足之处，请不吝赐教。

如何动态修改meta的title

　　要求：在不移除原生导航栏的情况下实现详情页的动态标题(列表页查询携带参数名到详情页实现动态标题)

　　@ on-item-click= $ router . push({ path:/yun CRM ，查询：{id:item.id，name:item.name}})

　　点击列表页将名称携带到详情页位置详情页的标题中，在router中赋给元标题，然后绑定到原生文档. title！

　　已创建(){

　　this.category_id=this。$ route . query . id；//列表的详细id

　　这个。$route.meta.title=this。$ route . query . name；//列表的名称

　　document.title=这个。$ route . meta . title；

　　}

　　注意：开头的逻辑是直接获取名称，赋给原生document.title！但这样一来，元标题可能会以空状态出现，页面的动态标题需要点击两次。如果第二次点击，会出现最后一个标题，因为第二次点击不经过router.js！

　　router.afterEach((收件人，发件人，下一个)={

　　if(to . path===/yun CRM to . query . name){

　　to . meta . title=to . query . name；

　　document . title=to . meta . title；

　　}

　　});

　　Router.js需要实现路由的判断，因为页面的title值最后显示的是meta中的标题，而不是query携带的名称，有点混乱。一开始是直接赋值，但是会出现空值现象。感谢大家的帮助和提醒！

　　注意：必须先使用to.query.name从列表页面接收实值，然后将它赋给最终显示的to.meta.title！

　　从一级页面跳转到多个二级页面，发现二级页面大致相同，除了面包屑的标题。

　　使用beforeRouteEnter在辅助页面上查看从该按钮的跳转。

　　一级页面：index.vue

　　//批量启用\批量禁用操作

　　顶部页面(项目){

　　这个。$ router . push({ path:/equipment/distribute/batch ，query: {type: item}})

　　二级页面：batch.vue

　　beforeRouteEnter:(收件人，发件人，下一个)={

　　if(to.query.type==start) {

　　To.meta.title=批量激活

　　} else if(to . query . type== stop ){

　　To.meta.title=批量停用

　　}

　　下一个()

　　console.log(至， tttt )

　　以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。