//在此之前先安装less 就不说了
npm install sass-resources-loader --save-dev //下载然后在build 的utils.js中exports.cssLoaders = function (options) {}中加上一下代码:
path.resolve //改为自己的代码目录function lessResourceLoader() {var loaders = [cssLoader,'less-loader',{loader: 'sass-resources-loader',options: {resources: [path.resolve(__dirname, '../src/assets/styles/common.less'),]}}];if (options.extract) {return ExtractTextPlugin.extract({use: loaders,fallback: 'vue-style-loader'})} else {return ['vue-style-loader'].concat(loaders)}}然后后面将 return{} 块中的 less: generateLoaders('less') 替换成上面自定义的函数 less: lessResourceLoader() //就行了
//之前用过less 但是用的都是小部分功能,少点命名而已 这次用了全局变量还是要记下的 less不能直接通用要用sass的方法
npm install vuex --save //安装vuex
//main.js中写入
import Vuex from 'vuex'
Vue.use(Vuex)在src 下创建文件夹store;创建store.js
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)export default new Vuex.Store({state:{count:0},mutations:{increment:state => state.count ++,decrement:state => state.count --,increment2 (state, n) {state.count += n;},increment3 (state, payload) {state.count += payload.price + payload.count;}}
})//然后再在main.js中引入文件与store
import store from './store/store'new Vue({el: '#app',store,router,template: '<App/>',components: { App }
}) //然后就可以使用啦
template><div class="hello"><div>{
{ count }}<p><button @click="increment">直接改变值</button><button @click="decrement">触发vuex事件</button><button @click="decrement2">触发vuex传值事件</button><button @click="decrement3">触发vuex传入对象事件</button><input v-model="message" placeholder="edit me"></p></div></div>
</template><script>export default{name:'sildebar',data(){return{message:10,}},methods:{increment(){ //直接改变值this.$store.state.count = 111},decrement(){ //触发vuex事件this.$store.commit('decrement')},decrement2(){ //出发传值事件console.log(typeof this.message)this.$store.commit('increment2', this.message);},decrement3(){ //触发传入对象事件this.$store.commit({type: 'increment3',price: 10,count: 8})}},computed:{count(){return this.$store.state.count},}}</script>
vuex 使用链接 https://www.cnblogs.com/songrimin/p/7815850.html vuex 详解
less全局变量 http://www.cnblogs.com/lcosima/p/9556372.html
window.AccessToken = JSON.parse(sessionStorage.getItem("AccessToken")); //获取请求头
sessionStorage.setItem('AccessToken',JSON.stringify(response.data.Data.AccessToken)); //使用set方法放入请求头 不然会消失的 键值对格式
window.AccessToken = JSON.parse(localStorage.getItem("AccessToken")); //获取请求头localStorage.setItem('AccessToken',JSON.stringify(response.data.Data.AccessToken)); //使用set方法放入请求头 不然会消失的 键值对格式
computed: {listenshowpage1() {//进行监测,因为他不会自动更新console.log("权限id改变啦");console.log(this.$store.state.prowerId);return this.$store.state.prowerId; //检测vuex属性计算}},watch: {listenshowpage1: function(a, b) { //进行检测 如果从子菜单变为添加顶级菜单就赋值为空if(a==""){console.log("菜单添加权限");}else {console.log("权限编辑")}}}