vue项目icon设置问题

背景：一个VUE项目，做了四个页面，每个页面只是在路由中做了配置，只是路径有差别，但是每个页面都放在不同场景之中，因此每个页面需要设置不同的icon

当前项目在public目录下index.html添加了
 <link rel="icon" href="<%= BASE_URL %>favicon.png">


请教大家是否有对应设置每个页面的方法

再main.js里面写个路由守卫判断是哪个界面，然后动态修改

(function() {
    var link = document.querySelector("link[rel*='icon']") || document.createElement('link');
    link.type = 'image/x-icon';
    link.rel = 'shortcut icon';
    link.href = 'http://www.stackoverflow.com/favicon.ico';
    document.getElementsByTagName('head')[0].appendChild(link);
})();    

参考：https://stackoverflow.com/questions/260857/changing-website-favicon-dynamically

动态绑定，定义一个变量，变量设置值以后会自动显示的。

不用，在html里设置就行了

用js动态改也行啊..

用js动态改也行啊..

已经找到解决办法
在mounted方法
            window.onload = function () {
                var link = document.querySelector("link[rel*='icon']") || document.createElement("link");
                link.type = "image/x-icon";
                link.rel = "shortcut icon";
                link.href = "图片网址";
                document.getElementsByTagName("head")[0].appendChild(link);
            };
 

您好，我是有问必答小助手，你的问题已经有小伙伴为您解答了问题，您看下是否解决了您的问题，可以追评进行沟通哦~

如果有您比较满意的答案 / 帮您提供解决思路的答案，可以点击【采纳】按钮，给回答的小伙伴一些鼓励哦～～

ps:问答VIP仅需29元，即可享受5次/月 有问必答服务，了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632

非常感谢您使用有问必答服务，为了后续更快速的帮您解决问题，现诚邀您参与有问必答体验反馈。您的建议将会运用到我们的产品优化中，希望能得到您的支持与协助！

速戳参与调研>>>https://t.csdnimg.cn/Kf0y