亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

vue 獲取及修改store.js里的公共變量實(shí)例

 更新時(shí)間:2019年11月06日 10:47:39   作者:jokren  
今天小編就為大家分享一篇vue 獲取及修改store.js里的公共變量實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧

html

<input type='text' :value='num'>
<button @click='add'> + </botton>

js

data(){
 return{
  
 }
},
methods:{
  add(){
   this.$store.commit('add',1)
 }
},
computed:{
 num:function(){
  // 因?yàn)橐鲂薷?num 的值 所以放在 計(jì)算屬性里
  return this.$store.state.num
 }
}

store.js

 state: {
  num:0
 },
 mutations: {
  add(state,shuzi){
   // shuzi是js里傳來(lái)的值 1
   state.num+shuzi
  }
 },

原理:

更改store中state狀態(tài)的唯一方法就是提交mutation,就很類似事件。每個(gè)mutation都有一個(gè)字符串類型的事件類型和一個(gè)回調(diào)函數(shù),我們需要改變state的值就要在回調(diào)函數(shù)中改變。我們要執(zhí)行這個(gè)回調(diào)函數(shù),那么我們需要執(zhí)行一個(gè)相應(yīng)的調(diào)用方法:store.commit。

以上這篇vue 獲取及修改store.js里的公共變量實(shí)例就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。

相關(guān)文章

  • 解決vue項(xiàng)目運(yùn)行npm run serve報(bào)錯(cuò)的問(wèn)題

    解決vue項(xiàng)目運(yùn)行npm run serve報(bào)錯(cuò)的問(wèn)題

    這篇文章主要介紹了解決vue項(xiàng)目運(yùn)行npm run serve報(bào)錯(cuò)的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
    2020-10-10
  • vue:左右過(guò)渡展開(kāi)折疊的組件

    vue:左右過(guò)渡展開(kāi)折疊的組件

    在網(wǎng)上找了好久關(guān)于左右過(guò)渡動(dòng)畫折疊的組件,沒(méi)有合適的代碼,效果類似于element UI中的Drawer抽屜組件,只不過(guò)ele中的都是懸浮的組件,工作中遇到的很多都是占用空間的展開(kāi)折疊,網(wǎng)上很多也是上下展開(kāi)收起的組件,于是就自己寫了一個(gè),分享給大家,感興趣的朋友參考下吧
    2023-11-11
  • vue-cli3.0+element-ui上傳組件el-upload的使用

    vue-cli3.0+element-ui上傳組件el-upload的使用

    這篇文章主要介紹了vue-cli3.0+element-ui上傳組件el-upload的使用,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2018-12-12
  • vue computed無(wú)法得到this的屬性或方法的解決

    vue computed無(wú)法得到this的屬性或方法的解決

    這篇文章主要介紹了vue computed無(wú)法得到this的屬性或方法的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2023-07-07
  • 在vue中使用css modules替代scroped的方法

    在vue中使用css modules替代scroped的方法

    本篇文章主要介紹了在vue中使用css modules替代scroped的方法,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2018-03-03
  • Vue CLI4.0 webpack配置屬性之productionSourceMap用法

    Vue CLI4.0 webpack配置屬性之productionSourceMap用法

    這篇文章主要介紹了Vue CLI4.0 webpack配置屬性之productionSourceMap用法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2024-06-06
  • 解決vue 局部過(guò)濾器獲取不到this的問(wèn)題

    解決vue 局部過(guò)濾器獲取不到this的問(wèn)題

    這篇文章主要介紹了解決vue 局部過(guò)濾器獲取不到this的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2022-01-01
  • vue的圖片需要用require的方式進(jìn)行引入問(wèn)題

    vue的圖片需要用require的方式進(jìn)行引入問(wèn)題

    這篇文章主要介紹了vue的圖片需要用require的方式進(jìn)行引入問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
    2022-03-03
  • 解決vue addRoutes不生效問(wèn)題

    解決vue addRoutes不生效問(wèn)題

    這篇文章主要介紹了解決vue addRoutes不生效問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
    2020-08-08
  • Vue 自定義ColorPicker及使用方法

    Vue 自定義ColorPicker及使用方法

    這篇文章主要介紹了Vue 自定義ColorPicker及使用方法,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
    2023-06-06

最新評(píng)論