在Vue-cli里应用Vuex的state和mutations方法
作者:oxgos 发布时间:2024-04-29 13:09:51
标签:Vue-cli,Vuex,state,mutations
首先,必须安装vuex的依赖
npm install vuex --save-dev
创建专属vuex的文件夹和store.js:
store.js里引入并应用插件vuex
定义常量state,用于存放变量&&定义常量mutations存放对变量的处理方法:
导出Vuex.store的实例,参数为刚才定义的state和mutations:
最后,还要在入口js文件引入到Vue的实例之中:
之后,我们就可以在组件当中,调用到我们在vuex存放的变量和方法:
首先:在父组件调用变量headTitle:
需要用到计算属性computed和vuex的mapState:(注释的写法也可以,但是mapState可以引入多个变量,比较方便)
这样,页面<h1>就会显示我们保存的变量headTitle的值为“口袋香港”
之后,我尝试在子组件,利用mutations的方法去改变headTitle的值:
结果,每次的改变,父组件的<h1>都会跟随改变。
这就是vuex的小小的应用实现。
来源:https://blog.csdn.net/oxgos/article/details/73557078


猜你喜欢
- 列表(List) 的三种遍历(序号和值)方法if __name__ == '__main__':
- 使用Python读取解析xmind文件,一键统计测试用例数量。问题:做测试的朋友们经常会用到xmind这个工具来梳理测试点或写测试用例,但是
- https://discuss.pytorch.org/t/how-to-modify-the-final-fc-layer-based-o
- 1、加字段:alter table 表名 ADD 字段名 类型;eg:alter table sys_cwzd ADD SCCLLJ VAR
- AES简介高级加密标准(AES,Advanced Encryption Standard)为最常见的对称加密算法(微信小程序加密传输就是用这
- 下面开始优化下my.conf文件(这里的优化只是在mysql本身的优化,之前安装的时候也要有优化)cat /etc/my.cnf# For
- 点阵字体是指根据文字的像素点来显示的字体,效果如下:使用Python读取并显示的过程如下:根据中文字符获取GB2312编码通过GB2312编
- 目录优化排序查询避免重复获取刚刚修改的数据行懒加载的联合查询优化排序查询自定义变量的一个重要特性是你可以同时将该变量的数学计算后的结果再赋值
- 网页过渡是指当浏览者进入或离开网页时,页面呈现的不同的刷新效果,比如卷动、百叶窗等。注:通过模板所建网页无法添加网页过渡效果!制作步骤:1、
- 我们经常会遇到一些对于多媒体文件修改的操作,像是对视频文件的操作:视频剪辑、字幕编辑、分离音频、视频音频混流等。又比如对音频文件的操作:音频
- 以下实验是我在百度公司实习的时候做的,记录下来留个小经验。多GPU训练cifar10_97.23 使用 run.sh 文件开始训练cifar
- 今天小池提出一个问题讨论,如何使分页做的更友好。做了一些调研和思考,做了些总结。分页在电商网站3级页、搜索结果页面等信息量大的页面是很重要的
- 数组都是从0开始。javascript是arrayname[i],而vbscript是arrayname(i) javascript的字符串
- vbscript中,错误处理使用on error resume next来完成,如果在你的代码里加入这一句,在这句之后的其他代码如果出现错误
- 有人把Go比作21世纪的C语言,第一是因为Go语言设计简单,第二,21世纪最重要的就是并行程序设计,而Go从语言层面就支持了并行。gorou
- 前言在接口测试的过程中,经常会遇到有些接口需要在登录的状态下才能请求,否则会提示请登录,那么怎样解决呢?我们可以通过Cookie绕过登录,其
- 前言ORDER BY 字段名 升序/降序,相信进来的朋友都认识这个排序语句,但遇到一些特殊的排序,单单使用字段名就无法满足需求了,下面给大家
- Flask web上传获取图像Image读取并使用图片上传界面后端@app.route('/upload')def uplo
- 前言本文主要介绍的是用yum安装MySQLdb模块的步骤,下面话不多说了,来看看详细的介绍吧。步骤如下MySQLdb依赖于mysql-dev
- 本文主要讲解Go语言中的函数式编程概念和使用,分享给大家,具体如下:主要知识点:Go语言对函数式编程的支持主要体现在闭包上面闭包就是能够读取