vuex安裝失敗解決的方法實例
1、報錯信息：
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: vue-base-rooter@0.1.0
npm ERR! Found: vue@2.6.14
npm ERR! node_modules/vue
npm ERR! vue@"^2.6.11" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vue@"^3.0.2" from vuex@4.0.2
npm ERR! node_modules/vuex
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Mae\AppData\Local\npm-cache\eresolve-report.txt for a full report.npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Mae\AppData\Local\npm-cache_logs\2022-02-13T13_20_52_363Z-debug.log
2、解決方案
npm install vuex@3.6.2 -S
然后查看package.json文件
有vuex版本說明安裝成功
使用小案例：定義一個加減的按鈕
代碼如下：
//引入mapstate讀取數(shù)據(jù)
import {mapState} from 'vuex'
//通過computed計算屬性 解構(gòu)得出數(shù)據(jù)
computed:{
...mapState(['count'])
},
methods:{
add(){
this.$store.dispatch('add')
},
reduce(){
this.$store.dispatch('reduce')
}
}
在actions中上下文解構(gòu)出{commit} actions可以處理異步
//我們在store中index.js文件中配置相應(yīng)處理
const actions={
//此處不能直接修改mapstate
add({commit}){
commit("ADD");
},
reduce({commit}){
commit("REDUCE");
},
};
const mutations={
ADD(state){
state.count++;
},
REDUCE(state){
state.count--;
}
};
const state={
count:1
};
寫到這里就可以實現(xiàn)按鈕加減count數(shù)據(jù)的操作了
總結(jié)
到此這篇關(guān)于vuex安裝失敗解決的文章就介紹到這了,更多相關(guān)vuex安裝失敗解決內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
解決VUE3 keep-alive頁面切換報錯parentComponent.ctx.deactivate
這篇文章主要介紹了解決VUE3 keep-alive頁面切換報錯parentComponent.ctx.deactivate is not a function的問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
這篇文章主要介紹了Vue如何實現(xiàn)從response讀取流下載問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2025-04-04
element-ui 關(guān)于獲取select 的label值方法
今天小編就為大家分享一篇element-ui 關(guān)于獲取select 的label值方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
vue刷新頁面時去閃爍提升用戶體驗效果的實現(xiàn)方法
這篇文章主要介紹了vue刷新頁面時去閃爍提升體驗方法,本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值，需要的朋友可以參考下2018-12-12
vue3+typescript實現(xiàn)圖片懶加載插件
這篇文章主要介紹了vue3+typescript實現(xiàn)圖片懶加載插件，幫助大家更好的理解和使用vue，感興趣的朋友可以了解下2020-10-10
這篇文章主要為大家詳細介紹了VUE+SpringBoot實現(xiàn)分頁功能，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-06-06
這篇文章主要介紹了vue中view-model雙向綁定基礎(chǔ)原理，文中給大家介紹了vue雙向綁定的原理總結(jié)，本文通過示例代碼給大家介紹的非常詳細,需要的朋友可以參考下2022-10-10
Element中el-tabs左右滑動動畫的實現(xiàn)
本篇博客將詳細介紹如何在使用 Vue 以及 Element UI 時,實現(xiàn)一個具有左右滑動效果的 tab 切換動畫,文中通過示例代碼介紹的非常詳細,需要的朋友們下面隨著小編來一起學(xué)習學(xué)習吧2024-03-03
Vue是一種流行的Web開發(fā)框架,它提供了一個雙向綁定的語法糖。在Vue中,我們可以很容易地獲取頁面上的數(shù)據(jù),并且可以實時的響應(yīng)其變化,這篇文章主要給大家介紹了關(guān)于Vue獲取input值的四種常用方法,需要的朋友可以參考下2023-09-09
在vue項目開發(fā)中,我們會將經(jīng)常用到的邏輯或模塊抽象成組件,對于那些多個項目都有用到的組件,可以考慮封裝成組件庫,這篇文章主要給大家介紹了關(guān)于webpack如何打包一個按需引入的vue組件庫的相關(guān)資料,需要的朋友可以參考下2022-02-02