把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的结合使用的更多相关文章

  1. 【笔记】vue+springboot前后端分离实现token登录验证和状态保存的简单实现方案

    简单实现 token可用于登录验证和权限管理. 大致步骤分为: 前端登录,post用户名和密码到后端. 后端验证用户名和密码,若通过,生成一个token返回给前端. 前端拿到token用vuex和lo ...

  2. CCF 201512-4 送货(错误)

    直接用DFS深搜,检查了好久没能发现错误,贴上来以后慢慢看... /* DFS深度优先搜索 Edge保存边 u{v,been} cnt记录走过的街道 如果没有就return ;继续递归 */ #inc ...

  3. [转] Making GTFS query more convenient

    url:http://ontrakinfo.wordpress.com/2012/10/29/making-gtfs-query-more-convenient/ 这简直说出了我的心声. I have ...

  4. 利用systemtap学习Linux路由代码

    http://bbs.chinaunix.net/thread-4090162-1-1.html 一.为什么要这样做读kernel route子系统代码,当我弄懂了数据结构之间的关系以及控制流程后,心 ...

  5. phpwind9.0升级到php7后出现的问题修复

    最近将一个两年多以前的用phpwind9.0搭建的论坛升级到php7,遇到了页面无法打开,显示为500错误,排查了一整天时间,终于解决! 1.打开文件:src/applications/appcent ...

  6. 聊聊OSM

    聊聊OSM 做路网的同学一定对OSM并不陌生,OSM是一个由英国人Steve Coast创立的一个项目,这个项目的目标是创建一个内容自由,且能让所有人编辑的世界地图.类似于维基百科的概念.和它对标的是 ...

  7. 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 ...

  8. <转载>ford-fulkerson算法

    原文链接http://blog.csdn.net/ivan_zgj/article/details/51580993 最大流问题常常出现在物流配送中,可以规约为以下的图问题.最大流问题中,图中两个顶点 ...

  9. antd、react-router-dom v4 解决菜单和地址同步问题

    点击不同的菜单,右边内容做相应的变化. 不过,对于后退操作和刷新页面操作无效,左边菜单无法保持选中项高亮. 解决思路如下: Menu 用 seletedKeys 来决定哪项被选中.需要判断当前选前的路 ...

  10. [数据结构]最大流之Ford-Fulkerson算法

    本文主要讲解最大流问题的Ford-Fulkerson解法.可以说这是一种方法,而不是算法,因为它包含具有不同运行时间的几种实现.该方法依赖于三种重要思想:残留网络,增广路径和割. 在介绍着三种概念之前 ...

随机推荐

  1. 【MongoDB】从入门到精通mongdb系列学习宝典,想学mongodb小伙伴请进来

    最近一段时间在学习MongoDB,在学习过程中总共编写了四十余篇博客.从mongodb软件下载到分片集群的搭建. 从理论讲解到实例练习.现在把所有博客的内容做个简单目录,方便阅读的小伙伴查询. 一. ...

  2. 唯品会的Service Mesh三年进化史 2018 年 Service Mesh 元年,被誉为是下一代微服务架构

    2018 年 Service Mesh 元年,被誉为是下一代微服务架构 https://www.sohu.com/a/225324586_465914 唯品会的Service Mesh三年进化史 - ...

  3. Chandy-Lamport_algorithm

    Chandy-Lamport algorithm - Wikipedia https://en.m.wikipedia.org/wiki/Chandy-Lamport_algorithm 经典快照算法 ...

  4. echarts将折线图改为曲线图

    只要在 series中加上属性: smooth: true(true为曲线.flase为直线)

  5. 如何通过 ClickBank 等类似虚拟平台进行在线销售并获得收益

    CLICKBANK在国内被广大赚友简称为CB,和淘金小站之前介绍过的PayDotCom一样,都是国外非常著名的CPS广告联盟.CLICKBANK成立于1998年,是全球四个最大的虚拟商品零售平台之一( ...

  6. ROC与AUC学习

    全文转自:https://www.cnblogs.com/gatherstars/p/6084696.html#commentform 这篇真的讲的清楚明白!要多复习!加深记忆! 1.概述 AUC(A ...

  7. Code signing is required for product type 'Application' in SDK 'iOS 11.2'

    在打包的时候出现这样一个错误,Code signing is required for product type 'Application' in SDK 'iOS 11.2'  ,就是说代码签名证书 ...

  8. 通过交换a,b 中的元素,使[序列a 元素的和]与[序列b 元素的和]之间的差最小

    题目描述: 有两个序列a,b,大小都为n,序列元素的值任意整数,无序:要求:通过交换a,b 中的元素,使[序列a 元素的和]与[序列b 元素的和]之间的差最小.例如:var a=[100,99,98, ...

  9. Element 中表单非必填数据项 必须为数字的验证问题

    Element-ui 的el-form组建中,自带基本的验证功能,比如某些项必填的验证,直接加入rules 规则中即可,如下实例: 在页面中书写如下: <el-form-item label=& ...

  10. let 与 var

    前言let与var最大的区别就是var会变量提升.var会被覆盖.var变量没有块级作用域,而let都将弥补这些bug.传统语言都不会有‘变量提升.重复声明被覆盖.变量没有块级作用’这些问题,这是js ...