vuex中mapActions的概念及用法

这篇具有很好参考价值的文章主要介绍了vuex中mapActions的概念及用法。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

概念

先看一下官方文档对mapActions的描述:
mapactions用法,前端,vue,javascript,前端,vue,javascript,vuex

简单来说 mapActions 就是将组件中的函数映射为对应的action

一般情况下我们会在组件中使用 this.$store.dispatch() 来触发 action ,想要调用多少个 action 就需要调用多少次 dispatch() ,而使用 mapActions 的话只需要往 mapActions 中传入与 action 同名的函数,然后调用这些函数即可触发对应的action

用法

了解了 mapActions 大概是用来干什么的之后,下面来介绍一下 mapActions 的具体用法

1、首先在vuex配置文件中定义要使用的 action :

actions: {
	login: function(context,data1) {
		console.log(data1)
	},
	exit: function(context,data2) {
		console.log(data2)
	}
}

2、在组件中引入并调用 mapActions ,然后通过调用 mapActions 中的函数的来触发 action :

<script>

import {mapActions} from "vuex" //引入mapActions

export default {
	data(){
		return{}
	}
	created(){
		// 调用函数触发action
		this.login('登录') //登录
		this.exit('退出') //退出
	}.
	methods:{
    	...mapActions(['login','exit']),
	}
}

</script>

👇觉得有帮助的朋友可以支持下作者哦,您的鼓励是我创作的最大动力,如有开发问题可联系作者
mapactions用法,前端,vue,javascript,前端,vue,javascript,vuex文章来源地址https://www.toymoban.com/news/detail-641597.html

到了这里,关于vuex中mapActions的概念及用法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 复数的概念及运算(复变函数)

    1. 复数 z= Re(z)+Im(z) i =x+yi (虚数单位 i,   ) 2.复数的代数运算(加减乘除) 3.共轭复数的性质(加减乘除) (1)                     (2)                            4.复数的几何表示 复平面 z=x+iyP(x,y) 复数的模  ,复数的辐角 Argz,辐角主值argz  复数的幅角:以x轴

    2024年02月03日
    浏览(34)
  • 【Linux】进程的概念及操作进程

    背景: 我们通过冯诺依曼体系结构知道,程序需要运行,需要将其从磁盘中传入内存,在传入CPU,由CPU将其运行起来。 了解了这个背景,我们就能对 进程 得出下面的理解: 进程 就是被加载到内存中的程序,或者被运行起来的程序就叫做 进程 。 这也是很多教材上的说法,

    2024年02月03日
    浏览(35)
  • 完全二叉树——堆的概念及实现

    堆(heap):是堆内存的简称,堆是动态分配内存,内存大小不固定,也不会自动释放,堆——数据结构是一种无序的树状结构,同时它还满足key-value键值对的存储方式。 如果有一个关键码的集合K = { , , ,…, },把它的所有元素按完全二叉树的顺序存储方式存储在一个一维

    2024年02月07日
    浏览(34)
  • git 中分支的概念及使用

    分支模型是 Git 中的 “必杀技特性”, Git 处理分支的方式非常轻量,创建新分支这一操作几乎能在瞬间完成,并且在不同分支之间的切换操作也是一样便捷。 理解和精通这一特性,我们便会意识到 Git 是如此的强大而又独特,并且从此真正改变我们的开发方式。 在版本控制

    2024年01月17日
    浏览(41)
  • <数据结构> 链表 - 链表的概念及结构

    概念: 链表是一种物理存储结构上非连续、非顺序的存储结构,数据元素的 逻辑顺序 是通过链表中的 指针链接 次序实现的 1、链表由一系列结点(链表中每一个元素称为结点)组成。 2、结点可以在运行时动态(malloc)生成。 3、每个结点包括两个部分:一个是存储数据元素的

    2023年04月09日
    浏览(44)
  • 一文详解Spring StateMachine的概念及应用

    Spring StateMachine是Spring官方提供的一个框架,供应用程序开发人员在Spring应用程序中使用状态机。支持状态的嵌套(substate)、状态的并行(parallel,fork,join)、子状态机等等。状态机可以帮助开发者简化状态控制的开发过程,使状态机结构更加层次化。 Spring StateMachine项目模

    2024年02月08日
    浏览(40)
  • spring之AOP的概念及简单案例

    AOP(Aspect Oriented Programming),即面向切面编程,可以说是OOP(Object Oriented Programming,面向对象编程)的补充和完善。OOP引入封装、继承、多态等概念来建立一种对象层次结构,用于模拟公共行为的一个集合。不过OOP允许开发者定义纵向的关系,但并不适合定义横向的关系,例

    2024年02月05日
    浏览(36)
  • 【数据结构】二叉树的概念及结构

    🚀write in front🚀 📜所属专栏: 初阶数据结构 🛰️博客主页:睿睿的博客主页 🛰️代码仓库:🎉VS2022_C语言仓库 🎡您的点赞、关注、收藏、评论,是对我最大的激励和支持!!! 关注我,关注我,关注我 , 你们将会看到更多的优质内容!! 树是一种 非线性的数据结构

    2023年04月23日
    浏览(42)
  • 【RabbitMQ】交换机的概念及使用

            RabbitMQ中,交换机是一个核心概念,主要用来将生产者生产出来的消息,传送到对应的队列中。实际上,生产者生产的消息从不会直接发送到队列,而是发送到交换机。交换机一方面接收来自生产者的消息,另一方面将这些消息推入队列。 四种类型的交换机: 直

    2024年01月25日
    浏览(33)
  • 存储引擎的概念及作用,玩转MySQL

    从今天开始, 就带各位小伙伴学习数据库技术。 数据库技术是Java开发中必不可少的一部分知识内容。也是非常重要的技术。本系列教程由浅入深, 全面讲解数据库体系。 非常适合零基础的小伙伴来学习。 全文大约【 1567】 字,不说废话,只讲可以让你学到技术、明白原理的

    2024年02月07日
    浏览(42)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包