Vue踩坑记录

    科技2026-02-16  9

    问题

    1. 在使用路由的时候,路由跳转却没有显示

    这种情况我们可以去查看我们的index.js中对于路由的配置是否有单词的拼写错误或者是关键词是否出错。 如果都没错的话,我们可以想想是否写了<router-view></router-view>这个标签,这个标签是渲染子路由的标签,如果缺少这个标签,将无法渲染子路由。

    2.在vue项目中如何设置标签头部的小图标

    解决方法如下: 第一步 在静态文件下引入我们要更换的的照片 第二步 在index.html文件中添加这样一段代码

    <link rel="icon" href="static/logo.png" type="image/x-icon" /> <link rel="shortcut icon" href="static/logo.png" type="image/x-icon" />

    展示效果如下:

    3. 设置meta路由元信息

    在刚开始时候我直接在路由的属性下写了meta信息,但是没有钩子函数配合下的路由并不能很好的起作用。 后来在网上查到需要使用钩子函数配合全局DOM元素才可实现title的变化 但是这样依旧不行,而且在编辑器自动运行的时候没出现错误,但是在浏览器的控制台却报了错。 最后我通过修改了index.js中默认导出的事例,为其创建了router变量,因为beforeEach一般是在router上使用的。而Router是一个类名。 创建时,需要将其先添加到变量new Router中。

    4.在未设置el-aside的宽度的时候默认为300px

    然后,就会出现这样的结果,竖导航栏出现空白。 我们只要在元素上添加width:auto! important;

    Processed: 0.008, SQL: 9