VUE2.5 - 常量

常量种类

1. 值类型：例如 APP_TITLE : 'XX系统'
2. key-value类型：例如 GENDER: [{'man':男}，{'woman':女}]

常量定义

1. 通过vuex统一定义
   在store/moudles/下建立各模块统一存放常量的文件，例如constData.js
   文件结构如下：

export default {
namespaced: true,
state: {
  APP: {
    title: 'XX系统',
    version: '1.0'
  },
  HISTORY_RANGE: [
    {key: 'week', label: '近一周'},
    {key: 'month', label: '近一月'},
    {key: 'year', label: '近一年'},
    {key: 'all', label: '所有'}
  ]
}
}

2. 与其他vuex的内容统一发布
   在sotre/index.js中进行统一发布：

import Vue from 'vue'
import 'babel-polyfill'
import Vuex from 'vuex'
import 模块1 from './modules/模块1'
import 模块2 from './modules/模块2'
import constData from './modules/constData'
Vue.use(Vuex)
const store = new Vuex.Store({
  modules: {
    模块1,模块2,constData
  }
})
export default store

常量应用

1. 在具体组件中引入常量

computed: {
    category () {
      return this.$store.state.constData.APP
    }
  },

2. 常量调用

<div class="title">
  {{category.title}}
  <span style="font-size:12px">{{category.version}}</span>
</div>