mixin的使用

@/store/index.js

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
import state from './state.js'
import mutations from './mutations.js'
import actions from './actions.js'
import XXX from './modules/XXX'
import getters from './getters'

const store = new Vuex.Store(
  {
    modules: {
      XXX
    },
    getters,
    state,
    mutations,
    actions,
  }
);
export  default store

@/store/state.js

const state = {
  adminLogin:false, //管理員登錄狀態(tài)
  fistAircraft:{},//飛機(jī)列表的第一架飛機(jī)信息
  aircraftId: '', //警報處理頁面中選中的報警發(fā)動機(jī)ID
  engineId:'', //警報處理頁面選中的發(fā)動機(jī)的ID
};
export default state

@/store/actions.js

const actions = {
  setAdminStatus ({commit},data) {
    commit('SET_ADMINSTATUS',data)
  },
  setHealthWidth ({commit},data) {
    commit('SET_HEALRHWIDTH',data)
  },
  setHealthHeight ({commit},data) {
    commit('SET_HEALRHHEIGHT',data)
  },
  setAircraftId ({commit},data) {
    commit('SET_AIRCRAFTID',data)
  },
  setFistAircraft ({commit},data) {
    commit('SET_FISTAIRCAFT',data)
  },
  setEngineId ({commit},data) {
    commit('SET_ENGINEID',data)
  },
};
export default actions

@/store/getters.js

const getters = {
    healthWidth: state => state.healthmanage.healthWidth,
    healthHeight: state => state.healthmanage.healthHeight,
    adminLogin: state => state.adminLogin,
    fistAircraft: state => state.fistAircraft,
    aircraftId: state => state.aircraftId,
    engineId: state => state.engineId,
}
export default getters

@/store/mutations.js

const mutations = {
  /*管理員身份標(biāo)識設(shè)置*/
  'SET_ADMINSTATUS': (state, status) => {
    state.adminLogin = status
  },
  'SET_AIRCRAFTID': (state, aircraftId) => {
    state.aircraftId = aircraftId
  },
  'SET_FISTAIRCAFT': (state,fistAircraft) => {
    state.fistAircraft = fistAircraft
  },
  'SET_ENGINEID': (state,engineId) => {
    state.engineId = engineId
  }
};
export default mutations

@/store/modules/XXX.js

const healthmanage = {
    state: {
        healthWidth: '',
        healthHeight: '',
    },
    mutations: {
        'SET_HEALRHWIDTH': (state, healthWidth) => {
            state.healthWidth = healthWidth
        },
        'SET_HEALRHHEIGHT': (state, healthHeight) => {
            state.healthHeight = healthHeight
        }
    }
}

export default healthmanage

@utils/miin.js

import {
  mapGetters,
  mapActions
} from 'vuex'

export const pmaMixin = {
  computed: {
    ...mapGetters([
      'healthWidth',
      'healthHeight',
      'adminLogin',
      'fistAircraft',
      'aircraftId',
      'engineId'
    ])
  },
  methods: {
    ...mapActions([
      'setHealthWidth',
      'setHealthHeight',
      'setAdminStatus',
      'setAircraftId',
      'setFistAircraft',
      'setEngineId'
    ]),
    computedPageSize() {
      let healthWidth =
        document.documentElement.clientWidth - 120 ||
        document.body.clientWidth - 120;
      let healthHeight =
        document.documentElement.clientHeight - 90 ||
        document.documentElement.clientHeight - 90;
        this.setHealthWidth(healthWidth)
        this.setHealthHeight(healthHeight)
    },
    // 判斷一個對象中是否存在鍵值為空的項
    formSomeTrim (obj) {
      for(var key in obj) {
        if(!obj[key].trim()) {
          return true
        }
      }
      return false
    },
    // 判斷一個對象中是否存在鍵值為字母
    formSomeMonogram (obj) {
      for(var key in obj) {
        if(+obj[key].trim() !== 0 && !+obj[key].trim()) {
          return true
        }
      }
      return false
    },
    getArguments(msg) {
      this.form.arguments = msg;
      // console.log(this.form);
    },
  }
}

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末傲武,一起剝皮案震驚了整個濱河市砚蓬,隨后出現(xiàn)的幾起案子腕唧,更是在濱河造成了極大的恐慌永乌,老刑警劉巖鬼佣,帶你破解...
    沈念sama閱讀 222,252評論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件矗积,死亡現(xiàn)場離奇詭異胰舆,居然都是意外死亡昨登,警方通過查閱死者的電腦和手機(jī)播演,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,886評論 3 399
  • 文/潘曉璐 我一進(jìn)店門冀瓦,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人写烤,你說我怎么就攤上這事翼闽。” “怎么了顶霞?”我有些...
    開封第一講書人閱讀 168,814評論 0 361
  • 文/不壞的土叔 我叫張陵肄程,是天一觀的道長。 經(jīng)常有香客問我选浑,道長蓝厌,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,869評論 1 299
  • 正文 為了忘掉前任古徒,我火速辦了婚禮拓提,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘隧膘。我一直安慰自己代态,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,888評論 6 398
  • 文/花漫 我一把揭開白布疹吃。 她就那樣靜靜地躺著蹦疑,像睡著了一般。 火紅的嫁衣襯著肌膚如雪萨驶。 梳的紋絲不亂的頭發(fā)上歉摧,一...
    開封第一講書人閱讀 52,475評論 1 312
  • 那天,我揣著相機(jī)與錄音腔呜,去河邊找鬼叁温。 笑死,一個胖子當(dāng)著我的面吹牛核畴,可吹牛的內(nèi)容都是我干的膝但。 我是一名探鬼主播,決...
    沈念sama閱讀 41,010評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼谤草,長吁一口氣:“原來是場噩夢啊……” “哼跟束!你這毒婦竟也來了莺奸?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,924評論 0 277
  • 序言:老撾萬榮一對情侶失蹤冀宴,失蹤者是張志新(化名)和其女友劉穎憾筏,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體花鹅,經(jīng)...
    沈念sama閱讀 46,469評論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡氧腰,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,552評論 3 342
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了刨肃。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片古拴。...
    茶點(diǎn)故事閱讀 40,680評論 1 353
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖真友,靈堂內(nèi)的尸體忽然破棺而出黄痪,到底是詐尸還是另有隱情,我是刑警寧澤盔然,帶...
    沈念sama閱讀 36,362評論 5 351
  • 正文 年R本政府宣布桅打,位于F島的核電站,受9級特大地震影響愈案,放射性物質(zhì)發(fā)生泄漏挺尾。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,037評論 3 335
  • 文/蒙蒙 一站绪、第九天 我趴在偏房一處隱蔽的房頂上張望遭铺。 院中可真熱鬧,春花似錦恢准、人聲如沸魂挂。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,519評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽涂召。三九已至,卻和暖如春敏沉,著一層夾襖步出監(jiān)牢的瞬間果正,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,621評論 1 274
  • 我被黑心中介騙來泰國打工赦抖, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留舱卡,地道東北人辅肾。 一個月前我還...
    沈念sama閱讀 49,099評論 3 378
  • 正文 我出身青樓队萤,卻偏偏與公主長得像,于是被迫代替她去往敵國和親矫钓。 傳聞我的和親對象是個殘疾皇子要尔,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,691評論 2 361

推薦閱讀更多精彩內(nèi)容

  • 安裝 npm npm install vuex --save 在一個模塊化的打包系統(tǒng)中舍杜,您必須顯式地通過Vue.u...
    蕭玄辭閱讀 2,945評論 0 7
  • ### store 1. Vue 組件中獲得 Vuex 狀態(tài) ```js //方式一 全局引入單例類 // 創(chuàng)建一...
    蕓豆_6a86閱讀 346評論 0 0
  • ### store 1. Vue 組件中獲得 Vuex 狀態(tài) ```js //方式一 全局引入單例類 // 創(chuàng)建一...
    蕓豆_6a86閱讀 732評論 0 3
  • 原文github地址 Mixin 的特性一直廣泛存在于各種面向?qū)ο笳Z言,它的實(shí)質(zhì)上是利用語言特性(比如 Ruby ...
    fish_yijinc閱讀 3,371評論 0 0
  • 混入 (mixins) 是一種分發(fā) Vue 組件中可復(fù)用功能的非常靈活的方式赵辕〖燃ǎ混入對象可以包含任意組件選項。當(dāng)組件...
    _hider閱讀 20,245評論 0 10