分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

【转】vue中动态设置meta标签和title标签

发布时间:2023-09-06 02:03责任编辑:郭大石关键词:meta

因为和原生的交互是需要h5这边来提供meta标签的来是来判断要不要显示分享按钮,所有就需要手动设置meta标签,标题和内容

//router内的设置{ ?????path: ‘/teachers‘, ?????name: ‘TDetail‘, ?????component: TDetail, ?????meta: { ???????title:"教师详情", ???????content: ‘disable‘ ?????} ???}, ???{ ?????path: ‘/article‘, ?????name: ‘Article‘, ?????component: Article, ?????meta: { ???????title: "文章详情", ???????content: ‘disable-no‘ ?????} ???}, ?//main.js里面的代码 ?router.beforeEach((to, from, next) => { ?/* 路由发生变化修改页面meta */ ?if(to.meta.content){ ???let head = document.getElementsByTagName(‘head‘); ???let meta = document.createElement(‘meta‘); ???meta.content = to.meta.content; ???head[0].appendChild(meta) ?} ?/* 路由发生变化修改页面title */ ?if (to.meta.title) { ???document.title = to.meta.title; ?} ?next()});

 转自:https://blog.csdn.net/qq_29515037/article/details/79475068

【转】vue中动态设置meta标签和title标签

原文地址:https://www.cnblogs.com/yunspider/p/9291765.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved