引入

65 阅读1分钟

vue2引入element-ui

import Vue from 'vue'
import App from './App.vue'
// 全部引入

// import ElementUI from "element-ui";
// import "element-ui/lib/theme-chalk/index.css";

// 按需引入
import { Button, Row,DatePicker } from "element-ui";
Vue.component(Button.name, Button);
Vue.component(Row.name, Row);
Vue.component(DatePicker.name, DatePicker);

Vue.config.productionTip = false
// Vue.use(ElementUI);
new Vue({
  render: h => h(App),
}).$mount('#app')

vue2引入vuex

1.public下新建store文件夹,其下新建index.js文件; 2.

import Vue from "vue";
import Vuex from "vuex";

//求和相关配置
const countOptions = {
  namespaced:true,
  actions: {
    jiaOdd(context, value) {
      if (context.state.sum % 2) {
        context.commit("JIA", value);
      }
    },
    jiaWait(context, value) {
      setTimeout(() => {
        context.commit("JIA", value);
      }, 500);
    },
  },
  mutations: {
    JIA(state, value) {
      state.sum += value;
    },
    JIAN(state, value) {
      state.sum -= value;
    },
  },
  state: {
    sum: 0,
    school: "幼儿园",
    subject: "前端",
  },
  getters: {
    bigSum(state) {
      return state.sum * 10;
    },
  },
};
//人员管理相关配置
const personOptions = {
  namespaced: true,
  actions: {
    
  },
  mutations: {
    ADD_PERSON(state, value) {
      state.personList.unshift(value);
    },
  },
  state: {
    personList: [{ id: "001", name: "张三" }],
  },
  getters: {},
};

Vue.use(Vuex);
export default new Vuex.Store({
  modules: {
   countAbout: countOptions,
   personAbout: personOptions,
  },
});

3.main.js引入store文件

import Vue from 'vue'
import App from './App.vue'
import store from './store'

Vue.config.productionTip = false

new Vue({
  render: h => h(App),
  store,
}).$mount('#app')