less.modifyVars改顏色主題

index.html增加

<link rel="stylesheet/less" type="text/css" href="theme.less" />

　　

theme.less文件內容：

@primary-color: #000;
body {
  background-color: @primary-color;
}

　　

想再哪個頁面有：

先引入less

import less from 'less';　

再使用

public componentDidMount() {
    setTimeout(() => {
      less.modifyVars({
        '@primary-color': 'red',
      });
    }, 5000);
  }

　　

用setTimeout模擬了按鈕點擊，具體邏輯自己加