首页 web前端 js教程 vuex中如何使用对象展开运算符实例详解

vuex中如何使用对象展开运算符实例详解

Feb 01, 2018 pm 01:22 PM
vuex 对象 展开

当需要进行vuex进行数据状态管理的时候,会使用到mapGetters,mapState,还有自身的计算属性的时候,这个时候就会用到这个了!本文主要和大家介绍vuex中使用对象展开运算符的示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧,希望能帮助到大家。

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 &#39;vuex&#39;

  export default {

    methods:{

      increment(){

        this.$store.commit(&#39;increment&#39;);

      }

    },

    computed:{

      ...mapGetters([

        &#39;count&#39;

      ]),

      ...mapState({

        counts(){

          return this.$store.state.count;

        }

      })

    }

  }

</script>
登录后复制

相关推荐:

JavaScript中运算符规则和隐式类型转换示例详解

Mysql之运算符与函数的总结

详细介绍JavaScript中运算符规则和隐式类型转换

以上是vuex中如何使用对象展开运算符实例详解的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

使用PHP的json_encode()函数将数组或对象转换为JSON字符串 使用PHP的json_encode()函数将数组或对象转换为JSON字符串 Nov 03, 2023 pm 03:30 PM

JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式,已经成为Web应用程序之间数据交换的常用格式。PHP的json_encode()函数可以将数组或对象转换为JSON字符串。本文将介绍如何使用PHP的json_encode()函数,包括语法、参数、返回值以及具体的示例。语法json_encode()函数的语法如下:st

使用Python的__contains__()函数定义对象的包含操作 使用Python的__contains__()函数定义对象的包含操作 Aug 22, 2023 pm 04:23 PM

使用Python的__contains__()函数定义对象的包含操作Python是一种简洁而强大的编程语言,提供了许多强大的功能来处理各种类型的数据。其中之一是通过定义__contains__()函数来实现对象的包含操作。本文将介绍如何使用__contains__()函数来定义对象的包含操作,并且给出一些示例代码。__contains__()函数是Pytho

如何将 MySQL 查询结果数组转换为对象? 如何将 MySQL 查询结果数组转换为对象? Apr 29, 2024 pm 01:09 PM

将MySQL查询结果数组转换为对象的方法如下:创建一个空对象数组。循环结果数组并为每一行创建一个新的对象。使用foreach循环将每一行的键值对赋给新对象的相应属性。将新对象添加到对象数组中。关闭数据库连接。

在Vue应用中使用vuex时出现“Error: [vuex] unknown action type: xxx”怎么解决? 在Vue应用中使用vuex时出现“Error: [vuex] unknown action type: xxx”怎么解决? Jun 25, 2023 pm 12:09 PM

在Vue.js项目中,vuex是一个非常有用的状态管理工具。它可以帮助我们在多个组件之间共享状态,并提供了一种可靠的方式来管理状态的变化。但在使用vuex时,有时会遇到“Error:[vuex]unknownactiontype:xxx”的错误。这篇文章将介绍该错误的原因及解决方法。1.错误原因在使用vuex时,我们需要定义一些actions和mu

在Vue应用中使用vuex时出现“Error: [vuex] do not mutate vuex store state outside mutation handlers.”怎么解决? 在Vue应用中使用vuex时出现“Error: [vuex] do not mutate vuex store state outside mutation handlers.”怎么解决? Jun 24, 2023 pm 07:04 PM

在Vue应用中,使用vuex是常见的状态管理方式。然而,在使用vuex时,我们有时可能会遇到这样的错误提示:“Error:[vuex]donotmutatevuexstorestateoutsidemutationhandlers.”这个错误提示是什么意思呢?为什么会出现这个错误提示?如何解决这个错误?本文将详细介绍这个问题。错误提示的含

数组和对象在 PHP 中的区别是什么? 数组和对象在 PHP 中的区别是什么? Apr 29, 2024 pm 02:39 PM

PHP中,数组是有序序列,以索引访问元素;对象是具有属性和方法的实体,通过new关键字创建。数组访问通过索引,对象访问通过属性/方法。数组值传递,对象引用传递。

PHP 函数如何返回对象? PHP 函数如何返回对象? Apr 10, 2024 pm 03:18 PM

PHP函数可以通过使用return语句后跟对象实例来返回对象,从而将数据封装到自定义结构中。语法:functionget_object():object{}。这允许创建具有自定义属性和方法的对象,并以对象的形式处理数据。

使用Python的__le__()函数定义两个对象的小于等于比较 使用Python的__le__()函数定义两个对象的小于等于比较 Aug 21, 2023 pm 09:29 PM

标题:使用Python的__le__()函数定义两个对象的小于等于比较在Python中,我们可以通过使用特殊方法来定义对象之间的比较操作。其中之一就是__le__()函数,它用于定义小于等于比较。__le__()函数是Python中的一个魔法方法,并且是一种用于实现“小于等于”操作的特殊函数。当我们使用小于等于运算符(&lt;=)比较两个对象时,Python

See all articles