less.modifyVars的用法

如下內容都是瀏覽器最終運行的代碼,若是是react或者vue的必須是編譯以後的文件
html中須要有一些內容css

<link rel="stylesheet/less" type="text/css" href="/color.less" />
<script>
      window.less = {
        async: false,
        env: "production" //production  development
      };
</script>

<script src="https://cdn.bootcss.com/less.js/2.7.3/less.min.js"></script>

這樣在js中就能夠直接修改變量了html

$('#color-switch a').click(function() {
    var value = $(this).text();
    less.modifyVars({'@my-color': value});
    less.refreshStyles();//好像無關緊要
});

上面那個color.less文件中必須有這個變量的定義和使用vue

@my-color:red;
.mydiv{
   color:@my-color;
}

若是less文件中沒有這個變量的定義或者沒有這個變量的使用,js切換是沒有效果的react

相關文章
相關標籤/搜索