vuex中使用對象展開運算符的示例
更新時間：2017年09月25日 10:47:29 作者：Sentiger
本篇文章主要介紹了vuex中使用對象展開運算符的示例，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
使用場景
當需要進行vuex進行數據狀態(tài)管理的時候，會使用到mapGetters,mapState,還有自身的計算屬性的時候，這個時候就會用到這個了！
1.首先需要安裝
npm install babel-plugin-transform-object-rest-spread -D
2.需要在.babelrc文件中新增以下
{
"presets": [
["env", { "modules": false }]
],
"plugins": ["transform-object-rest-spread"] //增加這一行
}
3.在vue組件中使用
<script>
import {mapState,mapGetters} from 'vuex'
export default {
methods:{
increment(){
this.$store.commit('increment');
}
},
computed:{
...mapGetters([
'count'
]),
...mapState({
counts(){
return this.$store.state.count;
}
})
}
}
</script>
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
這篇文章主要為大家詳細介紹了vue實現簡單跑馬燈效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-05-05
這篇文章主要給大家介紹了關于webstorm建立vue-cli腳手架的傻瓜式教程，文中通過圖文介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-09-09
這篇文章主要為大家詳細介紹了vue實現錨點定位功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-06-06
在antd中setFieldsValue和defaultVal的用法
這篇文章主要介紹了在antd中setFieldsValue和defaultVal的用法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-10-10
這篇文章主要為大家介紹了Vue?uni-app以H5模式引入Jquery配置教程詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-09-09
本篇文章主要介紹了vue.js之vue-cli腳手架的搭建詳解，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-05-05
vue中對監(jiān)聽esc事件和退出全屏問題的解決方案
這篇文章主要介紹了vue中對監(jiān)聽esc事件和退出全屏問題的解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-08-08
Tailwind CSS是一個全新的、可定制的CSS框架,它提供了一系列的CSS類,用于構建現代化的Web界面,這篇文章主要介紹了Vue2使用TailwindCSS方法及遇到問題小結,需要的朋友可以參考下2024-03-03
詳解基于element的區(qū)間選擇組件校驗(交易金額)
這篇文章主要介紹了詳解基于element的區(qū)間選擇組件校驗(交易金額)，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2021-01-01
vue.js中created方法是一個生命周期鉤子函數，一般可以在created函數中調用ajax獲取頁面初始化所需的數據，這篇文章主要介紹了Vue中created和mounted使用場景分析,需要的朋友可以參考下2023-05-05