最近根据设计要求app需要根据不同环境切换不同样式,网上找了很多方法都不理想,后面自己脑洞大开这么完成的,请大佬多指教!
一、新建全局变量js文件和公用样式文件,在main.js中引入
import './css/en.css'
import './css/a.css'
import globalVariable from './components/js/global_variable'
Vue.prototype.GLOBA = globalVariable
二、global_variable.js文件中这么写
let lang = JSON.parse(localStorage.getItem('language_s') == null ? 1 : localStorage.getItem('language_s'))
let en = ""
if(lang === 1){
en = ""
}else{
en = "a"
}
export default {
mar_l:"mar_l" + en,
}
三、html中引入类名
:class="GLOBA.mar_l"
四、切换点击事件
用localStorage保存值后刷新浏览器。
注意:ios需要用 location.reload()