关于vuex与v-route的结合使用
把vue实际用于项目的过程中遇到过一些问题
1.如何将vuex和vue-route结合使用(接口调用成功回调页面这类等等)
1.初始考虑的方法是在vuex引入vue-router,vuex写一些业务逻辑代码,当接口处理完毕之后通过vue-route来处理页面。
当时这种方式耦合性太高,不推荐使用。vuex应该处理数据相关的操作,不应该处理界面层的事情。
2.通过Promise的方式,比较推荐这种方式。在vuex里面返回Promise,页面层通过Promise来处理页面相关的操作,代码如下
actions: {
activitySetOrModifyManage({commit}, param){
console.log(param);
return new Promise((resolve, reject) => {
axios.post(baseUrl.activitySetManageUrl, qs.stringify(param))
.then(function (response) {
console.log(JSON.stringify(response.data));
let data = response.data;
if (data.code == 200) {
resolve();
} else {
reject()
}
})
.catch(function (error) {
console.log(error);
reject()
});
});
},
this.activitySetOrModifyManage(param).then(
()=>{
console.log('接口调用成功,编程改变路由')
this.$router.push({ path: '/activityList' })
},
()=>{
console.log('接口调用失败')
} );
在回调的Promise里面可以处理很多事情,关于页面层的事情都可以在这里处理。逻辑业务全部剥离放在vuex里面,降低耦合性。
关于vuex与v-route的结合使用的更多相关文章
- 【笔记】vue+springboot前后端分离实现token登录验证和状态保存的简单实现方案
简单实现 token可用于登录验证和权限管理. 大致步骤分为: 前端登录,post用户名和密码到后端. 后端验证用户名和密码,若通过,生成一个token返回给前端. 前端拿到token用vuex和lo ...
- CCF 201512-4 送货(错误)
直接用DFS深搜,检查了好久没能发现错误,贴上来以后慢慢看... /* DFS深度优先搜索 Edge保存边 u{v,been} cnt记录走过的街道 如果没有就return ;继续递归 */ #inc ...
- [转] Making GTFS query more convenient
url:http://ontrakinfo.wordpress.com/2012/10/29/making-gtfs-query-more-convenient/ 这简直说出了我的心声. I have ...
- 利用systemtap学习Linux路由代码
http://bbs.chinaunix.net/thread-4090162-1-1.html 一.为什么要这样做读kernel route子系统代码,当我弄懂了数据结构之间的关系以及控制流程后,心 ...
- phpwind9.0升级到php7后出现的问题修复
最近将一个两年多以前的用phpwind9.0搭建的论坛升级到php7,遇到了页面无法打开,显示为500错误,排查了一整天时间,终于解决! 1.打开文件:src/applications/appcent ...
- 聊聊OSM
聊聊OSM 做路网的同学一定对OSM并不陌生,OSM是一个由英国人Steve Coast创立的一个项目,这个项目的目标是创建一个内容自由,且能让所有人编辑的世界地图.类似于维基百科的概念.和它对标的是 ...
- neutron基础一(网络基本命令)基本命令,包括veth peer
ip addr ip link tcpdump -i veth1 -e -v route -n ip route arp ethtool -S veth0 ip link add type veth ...
- <转载>ford-fulkerson算法
原文链接http://blog.csdn.net/ivan_zgj/article/details/51580993 最大流问题常常出现在物流配送中,可以规约为以下的图问题.最大流问题中,图中两个顶点 ...
- antd、react-router-dom v4 解决菜单和地址同步问题
点击不同的菜单,右边内容做相应的变化. 不过,对于后退操作和刷新页面操作无效,左边菜单无法保持选中项高亮. 解决思路如下: Menu 用 seletedKeys 来决定哪项被选中.需要判断当前选前的路 ...
- [数据结构]最大流之Ford-Fulkerson算法
本文主要讲解最大流问题的Ford-Fulkerson解法.可以说这是一种方法,而不是算法,因为它包含具有不同运行时间的几种实现.该方法依赖于三种重要思想:残留网络,增广路径和割. 在介绍着三种概念之前 ...
随机推荐
- [报错]Unable to simultaneously satisfy constraints
项目中自定义Cell,控件使用autoLayout来设置约束,发现运行页面表现正常,但是控制台报如下错误: Unable to simultaneously satisfy constraints. ...
- jquery插件网址
各种分布图的插件:http://echarts.baidu.com/demo.html
- CentOS7系统基本操作
查看网卡命令 [root@localhost ~]# ip addr 1: lo: <LOOPBACK,UP,LOWER_UP> mtu 65536 qdisc noqueue state ...
- apt-get tips
1.通过apt-get安装指定版本的软件 apt-get install <package name>=<version> 2.通过apt-cache列举所有可获取的版本 ap ...
- Django内置form表单和ajax制作注册页面
settings.py import os # Build paths inside the project like this: os.path.join(BASE_DIR, ...) BASE_D ...
- understand EntityManager.joinTransaction()
Join Transaction The EntityManager.joinTransaction() API allows an application managed EntityManager ...
- Linux进入-adsdfsd目录
Linux进入-adsdfsd目录 如果某个目录名称是短线(短横线)开头的 要想在命令行中进入目录,使用如下命令: cd -- -adsdfsd 延伸: 其他非寻常操作: http://www.cnb ...
- JavaScript日期处理
一.Date类型 在讲述常见日期问题之前,先梳理一下Date类型的方法. ECMAScript中的Date类型使用自UTC(Coordinated in Universal Time,国际协调时间)1 ...
- abap编辑器中代码不可修改
当出现abap编辑器中代码不能修改的情况,可以按如下设置: edit——> 修改操作——>关闭助手
- usb-tooltip 重写.tooltip { word-break: break-all; }解决单词内换行
<div style="padding: 5px 10px; font-size: 16px; text-align: left" class="truncate& ...