Vue项目中如何设置动态的TDK

TDK在哪里

上面大佬对TDK的概念解释的很全面，但是在网页中的TDK在哪里呢，作为开发人员打开F12我们就可以看到

可以看到T就是我们页签中的标题，而description和keyword也是可以存在的但是并没有给用户直接展示的形式

设置网站TDK

在html中我们可以如下设置我们的网站TDK

设置后效果如下

Vue中动态设置TDK

1. 修改index.html

将TDK的内容清空，然后看到官方提到了位置的问题，meta标签必须写在头部head标签之内，而keywords的meta标签要写在title的meta标签之后，但又在description的meta标签之前，像下面这样的顺序写：

2. 来到路由配置中添加meta属性

meta: {

title: ‘首页’,

content: {

keywords: ‘关键字1，关键字2’,

description: ‘描述内容描述内容描述内容描述内容描述内容描述内容描述内容’

}

}

3. 找到Vue项目中的导航守卫

根据自己项目中导航守卫设置的位置，此处为了方便我就直接设置在了route.js中了

js基础

1)对js的理解？
2)请说出以下代码输出的值？
3)把以下代码，改写成依次输出0-9
4)如何区分数组对象，普通对象，函数对象
5)面向对象、面向过程
6)面向对象的三大基本特性
7)XML和JSON的区别？
8)Web Worker 和webSocket？
9)Javascript垃圾回收方法？
10)new操作符具体干了什么呢？
11)js延迟加载的方式有哪些？
12)WEB应用从服务器主动推送Data到客户端有那些方式？

ta到客户端有那些方式？

[外链图片转存中…(img-3CWP56OJ-1714384475614)]

[外链图片转存中…(img-NBNB9fHj-1714384475615)]

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】