在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ antd官網底部的color picker切換主題是怎么實現(xiàn)的？

antd官網底部的color picker切換主題是怎么實現(xiàn)的？

最近在研究antd一鍵切換主題的功能，但是官網定制主題的方案是通過less-loader的modifyVars修改配色，只能在編譯時使用。

const { injectBabelPlugin } = require('react-app-rewired');
const rewireLess = require('react-app-rewire-less');

module.exports = function override(config, env) {
  config = injectBabelPlugin(['import', { libraryName: 'antd', libraryDirectory: 'es', style: true }], config);
  config = rewireLess.withLoaderOptions({
    modifyVars: {
      "@primary-color": "#1DA57A",
    },
  })(config, env);
  return config;
};

但是我發(fā)現(xiàn)官網底部的color picker能夠實現(xiàn)切換主色的功能

請問這個功能是怎么實現(xiàn)的？

回答
編輯回答
笨尐豬

哈哈哈哈前兩天剛看過這個，這么冷門的問題居然還有其他人好奇。

它在網頁里放了一個 color.less，里面寫有所有跟顏色有關的樣式。位于其他所有樣式表的后面，以便覆蓋樣式。
unknown.png

同時它引入了 LESS.js。
每次 colorpicker 選了顏色的時候，會調用 less.modifyVars()，這時候 LESS 就會重新編譯 color.less，新的顏色也就應用上了。

希望對你有幫助

2017年4月24日 13:31