VueX环境的搭建

news2024/11/28 20:37:36

一、安装VueX

npm i vuex        // Vue3安装该版本

npm i vuex@3    // Vue2安装该版本

因为我使用的是Vue2,所以安装的是3版本 

二、配置VueX文件

在src目录下创建store文件夹,再创建index.js

在index.js中配置如下代码:

// VueX配置文件

// 引入文件
import Vuex from 'vuex';
import Vue from 'vue';

Vue.use(Vuex);  // 使用VueX 组件

// actions
const actions = {};

// mutations
const mutations = {};

// state
const state = {};

// 创建并导出Store对象
export default new Vuex.Store({
    actions,
    mutations,
    state
})

三、引入store

在main.js中引入并配置store

import Vue from 'vue'
import App from './App.vue'

Vue.config.productionTip = false;

// 引入Store
import Store from "./store";

new Vue({
  render: h => h(App),
  Store,  // 配置Store
}).$mount('#app')

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1160100.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Android广播BroadcastReceiver

BroadcastReceiver组件 BroadcastReceiver是Android中的一个组件,用于接收和处理系统广播或应用内广播。它可以监听系统事件或应用内自定义的广播,并在接收到广播时执行相应的操作。 广播是一种用于在应用组件之间传递消息的机制。通过发送广播&#x…

一个小技巧,显著提升大模型推理能力!加州大学提出MAF多反馈框架

作者 | 谢年年 最近,多篇文章《GPT-4的推理能力非常有限,有两篇论文为证》、《DeepMind:无法自我纠正推理,除非提前得知正确答案》指出大模型在推理任务中似乎没有自我改进的能力。即在无任何外部反馈的情况下无法通过自我纠正的形…

Vue3.0 toRef toRefs :VCA模式

简介 作用: 创建一个ref对象,其value值指向另一个对象中的某个属性 语法: const name toRef(person, name) 应用: 要将响应式对象中的某个属性单独供应给外部使用时 扩展: toRefs与toRef功能一致,但可…

会声会影2023输出文件太大怎么办

会声会影2023是一款专业的视频编辑软件,它由于简单易学的操作被众人所喜爱。在会声会影中编辑好的视频一般以渲染的形式导出保存,但是有时会出现输出文件太大的情况,这到底是什么原因呢?下面由我带大家一起来了解会声会影输出文件…

每天学习都很累,该怎么办?

中考淘汰一批人,高考又淘汰一批人,能杀进大学的,都知道高考的累。好不容易进了大学,却发现仍有打卡、作业、考试。 加上每天满满的课表,只是看看就让人心累。 为了奖学金或升学就业,又得去卷绩点、卷比赛、…

【Linux】Linux+Nginx部署项目(负载均衡动静分离)

🥳🥳Welcome Huihuis Code World ! !🥳🥳 接下来看看由辉辉所写的关于Linux的相关操作吧 目录 🥳🥳Welcome Huihuis Code World ! !🥳🥳 一.Nginx负载均衡 1.什么是负载均衡 2.实…

AIGC驱动,商业翻新,拓世法宝AI智能直播一体机,绘就商业革命新篇章

迈入数字新纪元,AIGC技术掀起了全球范围内的内容创作革命。这种借人工智能之力突破创造力边界的技术,已将内容生成的门槛降至前所未有的低点。AIGC凭借其惊艳的内容生成能力,收获了众人的瞩目。这不是一瞬间的激情释放,而是新时代…

UML类图关系

1.依赖 依赖关系由箭头表示,含义为A类在类中用到了B类,如B类作为A类的属性、参数、返回值等都属于依赖关系。 2.泛化(继承) 泛化用三角箭头和直线表示,extend。 3.实现 实现用三角箭头和虚线表示,在…

订水商城实战教程07-搜索

目录 1 创建数据源2 首页搜索功能3 创建搜索页面4 搭建搜索结果页面总结 上一篇我们讲解了店铺信息的展示功能,本篇讲解一下搜索功能。通常小程序在首页都配置了搜索的功能,输入关键词进行检索,可以在结果页上进行选购。同时还记录了用户的搜…

博客系统自动化测试项目实践

文章目录 一.测试需求分析1.功能分析2.非功能分析 二.制定测试方案(计划 策略)三.编写测试用例四.执行自动化测试用例五.编写测试报告六.项目总结 一.测试需求分析 1.功能分析 通过功能测试需求分析 2.非功能分析 非功能分析主要从:界面,性能,安全性,…

jmeter性能测试如何实现分布式部署

jmeter什么要做分布式部署? jmeter是运行在JVM虚拟机上的,当模拟大量并发时,对运行机器的性能/网络负载会很大。 此时就需要使用jmeter的分布式部署功能,实现多台被控机器同时并发访问被测系统。 原理图: 准备工作&…

小型取暖器上亚马逊美国站UL1278标准如何办理?

小型取暖器上亚马逊美国站UL1278标准如何办理? 小型取暖器上亚马逊美国站UL1278标准如何办理? 冬季马上就要来临,随着气温一天一天的下降,取暖器就是这个冬季必不可少的好物了,试想一下冬天一家人围着取暖器&#xf…

《TCP/IP详解 卷一:协议》第5章的IPv4数据报的Checksum(校验和)字段的计算(这里才能解开你的困惑)

首先,我当你看过书,但是比较懵。 1,实例说明Checksum(校验和)的计算步骤 直奔主题,分析一下这个Checksum(校验和)怎么算出来的。 先用Wireshark随便抓一个UDP或TCP包分析一下。 如上面,我们得…

SIP 系统容器化实践

由于SIP系统相对成熟,目前互联网上的SIP系统方案大多数都是基于虚拟机来实现的。 本文是基于容器化实现SIP系统的方案以及遇到的问题总结。 本文会展示两个系统的SIP实现,分别是智能语音机器人和CTI系统,不会涉及太多的业务,只是对…

前端实验(一)单页面应用的创建

实验目的 掌握使用vite创建vue3单页面程序命令熟悉所创建程序的组织结构熟悉单页面程序运行原理能够编写简单的单页面程序 实验内容 创建一个名为vue-demo的单页面程序编写简单的单页面程序页面运行单页面程序 实验步骤 使用vite创建单页面程序 创建项目名为目录vue-demo的…

【缓存】Spring全家桶中@CacheEvict无效情况共有以下几种

Spring全家桶中CacheEvict无效情况共有以下几种 一、背景介绍二、原因分析三、解决方案 一、背景介绍 SpringBoot中使用Cacheable注解缓存数据,使用CacheEvict注解删除缓存。但是在项目使用过程中,发现使用CacheEvict注解删除缓存无效。 拓展&#xff…

GORM:在Go中轻松管理数据库

GORM综合介绍 - Go对象关系映射库 在现代软件开发中,高效的数据库管理对于构建强大的应用程序至关重要。GORM是Go开发人员寻求与数据库进行交互的简化方式的宝贵工具。GORM是Go对象关系映射的缩写,它为Go的面向对象世界与数据库的关系世界之间提供了桥梁…

【Flink】全网最详细4W字Flink全面解析与实践(上)

本文已收录至GitHub,推荐阅读 👉 Java随想录 微信公众号:Java随想录 原创不易,注重版权。转载请注明原作者和原文链接 文章目录 流处理 & 批处理无界流Unbounded Streams有界流Bounded Streams Flink的特点和优势Flink VS Spa…

兴业银行养老金拉新项目上线啦,地推百搭项目

兴业银行养老金就在 ”聚量推客“ 申请开通 今年最火的银行拉新项目就是养老金的 单价高 数据好 目前开通养老金的银行有 兴业银行养老金拉新 交通银行养老金拉新 工商银行养老金拉新 招商银行养老金拉新 浦发银行养老金拉新 广发银行养老金拉新等。。还有很多都开通了…

Nignx及负载均衡动静分离

目录 一.Nignx简介 二.nginx搭载负载均衡 负载均衡 1.1启动nginx ​编辑 ​编辑 1.2开始 1.3导入前端数据 ​编辑 三.前端项目Linux部署(动静分离) 一.Nignx简介 Nginx是一个高性能的开源HTTP和反向代理服务器,也可以用作电子邮件(SMTP/IMAP&am…