vuex安装失败解决的方法实例

目录
  • 1、报错信息:
  • 2、解决方案
  • 使用小案例:定义一个加减的按钮
  • 总结

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读取数据
    import {mapState} from 'vuex'
//通过computed计算属性 解构得出数据
   computed:{
     ...mapState(['count'])
      },
   methods:{
       add(){
        this.$store.dispatch('add')
       },
    reduce(){
        this.$store.dispatch('reduce')
       }
    }

在actions中上下文解构出{commit}    actions可以处理异步

//我们在store中index.js文件中配置相应处理
  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
  };

写到这里就可以实现按钮加减count数据的操作了

总结

到此这篇关于vuex安装失败解决的文章就介绍到这了,更多相关vuex安装失败解决内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • Vue基于vuex、axios拦截器实现loading效果及axios的安装配置

    准备 利用vue-cli脚手架创建项目 进入项目安装vuex.axios(npm install vuex,npm install axios) axios配置 项目中安装axios模块(npm install axios)完成后,进行以下配置: main.js //引入axios import Axios from 'axios' //修改原型链,全局使用axios,这样之后可在每个组件的methods中调用$axios命令完成数据请求 Vue.prototype.$axios=Axios l

  • VueX安装及使用基础教程

    目录 1.安装vuex依赖包 2.导入vuex包 3.创建 store 对象 4.将 store 对象挂载到vue实例中 (1).State: (2).Mutations: (3).Actions: (4).Getters: 1.安装vuex依赖包 npm install vuex --save 2.导入vuex包 import Vuex from 'vuex' Vue.use(Vuex) 3.创建 store 对象 export default new Vuex.Store({ // stat

  • Vuex的安装、搭建及案例详解

    目录 前言 Vuex原理讲解 1.安装vuex组件 2.使用Vuex 求和案例 Coute.vue store.js Actions Mutations getters的使用: store Store仓库数据的使用: 效果图 GetState 的引入 总结 前言 本文讲诉了Vuex的安装.搭建.以及Actions.Mutations.State.Getters的使用,为什么使用mapState.mapGetters以及一些细节的解释 Vuex原理讲解 Actions:词义是 动作行为 Mutat

  • vue基础入门之vuex安装与使用

    目录 1.什么是vuex 2.安装和引入 3.vuex的使用 4.流程介绍 5.mutation 6.getters过滤 7.Action--异步处理 8.Module 总结 本教程为入门教程,如有错误,请各位前端大佬指出. 1.什么是vuex Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化.详细介绍可以参照官网文档vuex.vuejs.org/zh/ 下面简单介绍vuex 2.安装和引入

  • vuex安装失败解决的方法实例

    目录 1.报错信息: 2.解决方案 使用小案例:定义一个加减的按钮 总结 1.报错信息: npm ERR! code ERESOLVEnpm ERR! ERESOLVE unable to resolve dependency treenpm ERR!npm ERR! While resolving: vue-base-rooter@0.1.0npm ERR! Found: vue@2.6.14npm ERR! node_modules/vuenpm ERR! vue@"^2.6.11"

  • node-sass安装失败解决方法总结(终有一款适合你)

    目录 前言 解决方法一:使用淘宝镜像源(推荐) 解决方法二:使用 cnpm 解决方法三:创建.npmrc文件 解决方法四:下载 .node 到本地 如果这个 .node 还不能解决用这个方法.直接搞定. 解决方法五:使用梯子 来源 解决办法三,重新配置node-sass 缓存! 解决办法 操作步骤 总结 前言 项目中常常遇到node-sass安装失败,动不动就是报各种错误.以前我一次也没有失败过,自从系统重装我的天呀,node-sass就没有成功过,我能做的node卸载,sass重装各种版,以及

  • 如何在Linux操作系统下安装Apache服务的方法实例详解

    链接下载: 操作环境 VMware虚拟机中CentOS 7.6 SecureCRT Xftp(Xmanager) 需求分析 使用Apache服务实现访问http 操作步骤 1.挂载光盘 [root@localhost ~]# mount /dev/cdrom /mnt 查看是否挂载 [root@localhost ~]# df -Th 2.从源码包编译安装程序 (编译安装) [root@localhost Packages]# yum -y install gcc gcc-c++ make 3.

  • SQL Sever 2005 Express 安装失败解决办法

    后下载sql sever 2005 express单独安装,发现总是到了安装MSXML 6时出错.然而打算在控制面板里删除MSXML 6 Service Pack 2 (KB954459)又删不了,最后终于找到解决办法.详细见http://support.microsoft.com/kb/968749/zh-cn

  • SQL Server 2005 Express 安装失败解决办法

    后下载sql sever 2005 express单独安装,发现总是到了安装MSXML 6时出错.然而打算在控制面板里删除MSXML 6 Service Pack 2 (KB954459)又删不了,最后终于找到解决办法.详细见http://support.microsoft.com/kb/968749/zh-cn

  • Python中pyecharts安装及安装失败的解决方法

    pyecharts 是一个用于生成 Echarts 图表的类库.Echarts 是百度开源的一个数据可视化 JS 库.这篇文章重点给大家介绍pyecharts安装失败的处理方法,具体详情如下: pyecharts库的安装 1.正常安装 首先在打开终端输入以下命令:pip install pyecharts 在终端输入pip list查看是否安装成功测试程序: from pyecharts.charts import Bar bar = Bar() bar.add_xaxis(["衬衫"

  • asp.net mvc3.0安装失败如何解决

    先来看看安装失败的截图 原因分析 因为vs10先安装了sp1补丁,然后安装的mvc3.0,某些文件被sp1补丁更改,导致"VS10-KB2483190-x86.exe"安装不了,造成安装失败. 解决方案 方法1: 解压mvc安装包(AspNetMVC3Setup.exe)找到parameterinfo.xml文件,删除里面"<Exe CanonicalTargetName="VS10-KB2483190-x86".....</Exe>&q

  • MySQL5.5版本安装与安装失败详细讲解

    目录 MySQL5.5版本安装详细讲解 安装失败的情况 总结 MySQL5.5版本安装详细讲解 1.打开下载的安装文件,出现如下界面,mysql安装向导启动,点击“next”继续 2.同意协议,点击“next”继续 3.选择安装类型 1.Typical----默认安装2.Custom----完全安装3.Complete----用户自定义安装 4.点击“Install”开始安装. 5.正在安装 6.MySQL安装完成 7.配置MySQL 8.选择配置方式 9.选择服务器类型 10.选择mysql数

  • Realtek HD Audio Driver安装失败的解决方法

    主板是捷波主板P6AC-MX,芯片组是Intel945GC+ICH7,按照先主板驱动,后显卡,再声卡,结果却装来一个鸟"安装Realtek HD Audio Driver失败"的提示,晕.又听说是光盘里的驱动程序有问题,然后再到捷波的官方站下载驱动,再装,还是这个失败的提示.莫法,开动搜索思想,找来可行的解决方法. 先说下什么是HD Audio. HD Audio是High Definition Audio(高保真音频)的缩写,原称Azalia,是Intel与杜比(Dolby)公司合力

  • Visual Studio 2017安装失败的解决方法

    vs2017安装操作失败,今天VS2017更新之后...MVC5右击没有Controller出现 然后我就修复,重装...都不行并且出现 安装操作失败..提示.Net.Core.SDK安装失败 然后我又下载了个SDK...装不上去... 错误提示: 由于发生一个或多个包故障,产品未能安装列出的工作负荷和组件. 工作负荷不完整 ASP.NET 和 Web 开发 (Microsoft.VisualStudio.Workload.NetWeb,version=15.0.26323.1) 组件不完整 .

随机推荐