两者的区别

(1)this.$store.commit()
  commit: 同步操作

this.$store.commit('方法名',值)【存储】

this.$store.state.方法名【取值】

(2)this.$store.dispatch()
  dispatch: 异步操作

this.$store.dispatch('方法名',值)【存储】

this.$store.getters.方法名【取值】

  当操作行为中含有异步操作,比如向后台发送请求获取数据,就需要使用action的dispatch去完成了。其他使用commit即可。

  相关基础知识:
  commit=>mutations,用来触发同步操作的方法。
  dispatch =>actions,用来触发异步操作的方法。
  在store中注册了mutation和action,在组件中用dispatch调用action,然后action用commit调用mutation。

参考链接:Vue中this.$store.dispatch() 与 this.$store.commit()

Vue中this.$store.dispatch() 与 this.$store.commit()的区别的更多相关文章

  1. vuex中this.$store.dispatch和this.$store.commit的区别(都是调用vuex中的方法。一个异步一个同步)

    dispatch:含有异步操作,例如向后台提交数据,写法: this.$store.dispatch('action方法名',值) commit:同步操作,写法:this.$store.commit( ...

  2. vue中assets文件夹与static文件夹的区别

    1.如果这些产品图片文件“万年不变”,放在 /static 目录里,(不需要使用require将这些图片作为模块来引用) var products = [{ img: '/static/img/pro ...

  3. Vue中computed(计算属性)、methods、watch的区别

    实现效果:字符串的动态拼接 methods方法 html: <div id="app"> <!-- 监听到文本框数据的改变 --> <input ty ...

  4. vue中 computed和watch的一些简单理解(区别)

    今天看到一个问题,就是vue的computed和watch要在哪些场景下使用,其实也就是在问他们的区别.computed也就是计算属性,它可以帮助我们将在模板中的一些稍微复杂的逻辑计算放回到js代码中 ...

  5. vue中import xxx from 和 import {xxx} from的区别

    1.import xxx from import FunName from ‘../xxx’ 对应js中的引用: export defualt function FunName() { return ...

  6. Vue中computed、methods、watch的联系和区别

    computed是计算树形,methods是方法. new Vue({ el: '#example', data: { message: 'Hello' }, computed: { reversed ...

  7. Vue中 v-for 绑定key和不绑定key的区别

    首先,它们区别主要在于 虚拟DOM的复用,绑定key可以更好的复用,下面来详细讲一下 假如我们有一个数组 arr = [1,2,3,4],我们要在2后面插入一个值9: 如果绑定了key值,那么会是这样 ...

  8. 前端笔记之Vue(五)TodoList实战&拆分store&跨域&练习代理跨域

    一.TodoList 1.1安装依赖 安装相关依赖: npm install --save-dev webpack npm install --save-dev babel-loader babel- ...

  9. 【vue store的使用方法】(this.$store.state this.$store.getters this.$store.dispatch this.$store.commit)

    vue 页面文件 <template> <div> {{this.$store.state.count}}<br/> {{count}}<br/> {{ ...

  10. Elasticsearch学习之图解Elasticsearch中的_source、_all、store和index属性

    转自 : https://blog.csdn.net/napoay/article/details/62233031 1. 概述 Elasticsearch中有几个关键属性容易混淆,很多人搞不清楚_s ...

随机推荐

  1. [Dest0g3 520迎新赛]funny_upload

    打开靶机抓包发现过滤代码 发现.htaccess能上传后传入图片马 发现内容对<?进行过滤 我们换一种方式写后门代码 <script language="php"> ...

  2. KubeSphere DevOps 系统功能实战

    James,Java 工程师,喜欢学习和记录当下热门技术并验证其优势和缺点,以及当下火热的云原生解决方案的实施与推广. 前言 基于 Jenkins 的 KubeSphere DevOps 系统是专为 ...

  3. hasOwnProperty()方法

    hasOwnProperty()方法可以检测对象是否有某个属性 var man = { legs:2, hands:2, heads:1 } man.hasOwnProperty("head ...

  4. 【Azure Bot Service】部署Python ChatBot代码到App Service中

    问题描述 使用Python编写了ChatBot,在部署到App Service,却无法启动. 通过高级工具(Kudu站点:https://<your site name>.scm.chin ...

  5. 2024 Navicat Premium 16+17安装教程(附激活方法)

    Navicat Premium,作为一款功能全面的集成数据库管理工具,无缝支持多样化的数据库类型,为用户带来前所未有的高效与便捷管理体验.它不仅涵盖了连接管理.数据导入导出.同步迁移.备份恢复等核心功 ...

  6. Diffuision Policy + RL -------个人博客_ZSY_20241101

    Diffusion Policy: Visuomotor Policy Learning via Action Diffusion Cheng Chi, Zhenjia Xu, Siyuan Feng ...

  7. Luatools新手必看:从下载开始的保姆级教程!

    ​ 作为由合宙所提供的调试工具,Luatools支持最新固件获取.固件打包.trace打印.单机烧录等功能 此工具适用于合宙所有 4G 模组和 4G + GNSS 模组. 一.下载和安装 (一)运行环 ...

  8. 深入解析 WezTerm 的自定义功能:键绑定和鼠标绑定

    WezTerm 是一个高性能的跨平台终端模拟器,它提供了广泛的自定义选项,包括键绑定和鼠标绑定,使得用户可以根据自己的需求优化操作界面.本文将详细介绍几个关键的自定义功能,解释它们的用途,并展示如何配 ...

  9. JDBC中驱动加载的过程分析

    江苏 无锡 缪小东 本篇从java.sql.Driver接口.java.sql.DriveManager类以及其它开源数据库的驱动类讨论JDBC中驱动加载的全过程以及JDBC的Framework如何做 ...

  10. Jenkins之插件汇总

    Nodejs: 构建前端项目或Node项目 Build Name and Description Setter Publish over SSH: 远程执行shell命令 Blue Ocean   友 ...