zoukankan      html  css  js  c++  java
  • vue项目网站换肤

    由于我网站不是的单色,换动的样式有点多,所以我只能通过后端传给我的不同的皮肤类型,来控制不同的样式文件

    在网上查了一堆,每一个有用的

    if(store.getters.infoType==1){
        require("./static/styles/skin.css");
    }else if(store.getters.infoType==2){
         require("./static/styles/skin2.css");
    }else if(store.getters.infoType==3){
        require("./static/styles/skin3.css");
    }
    这种方法不成立,本地有效打包之后vue默认会用最后一个的样式,做不到切换

    想到以前用jquery操作不同的样式文件,试了下还真的实现了

    1,首先在脚手架的index,html文件里面加入一个假的link

    <link rel="shortcut icon" href="./static/favicon.ico"/>
    2
    changeSkin(){
          var Link=document.querySelector(".skinLink");
          /*通过js获取到这个DOM元素然后给他加不同的样式即可*/
          if(this.infoType==1){
            Link.setAttribute("href","./static/styles/skin.css");
          }else if(this.infoType==2){
            Link.setAttribute("href","./static/styles/skin2.css");
          }else if(this.infoType==3){
            Link.setAttribute("href","./static/styles/skin3.css");
          }
        }
    

    3由于我是通过vuex做的数据存储,刷新页面数据消失

    所以在main.js里面我要再次去做以上请求,不要忘记了否则刷新就什么度没了

  • 相关阅读:
    Shader Forge学习
    Unity 编辑器扩展
    DoTween
    游戏AI之群组行为
    Unity与服务区交互数据
    NGUI制作流光效果
    NGUI组件整理总结
    Resharp使用简记
    C#使用LitJson对Json数据解析
    BehaviorDesigner学习
  • 原文地址:https://www.cnblogs.com/zhihou/p/9530483.html
Copyright © 2011-2022 走看看