在 index.js 中可以配置后台的地址;代理的方式;

 这个文件在 config 中

  

  proxyTable: {
// 连接后台
'/api':{
target:"http://new.windhouse.com", //后台地址
changeOrigin:true, //跨域代理
pathRewrite: {
'^/api':"" //路径重写
},

然后 安装 axios 依赖

npm install axios

我是在main.js 里面定义了axios

//main.js
import axios from 'axios'
Vue.prototype.$http = axios //在其他组件中使用
this.http.post()

之后就使用 axios的方式对接上后台的api就可以了

 this.$http.post('/api',
qs.stringify({
'phone':this.fromlist.phone,
'password':this.fromlist.password
})
)
.then(this.PostFrommsg)
.catch((err)=>{console.log(err)}) //这里只是我习惯把成功函数写在别的函数里面
PostFrommsg (res){
console.log(res)
}

上面使用到的   “  qs   ” ,是使用了另外一个依赖

因为 ajax 跟 axios  的传值方式有些不一样所以需要转换一下

安装调用一下就可以了

npm install qs
//然后在项目里面使用就可以了

import qs from 'qs'
qs.stringify({  XXX   })
 

vue 连接后台的更多相关文章

  1. 基于Vue实现后台系统权限控制

    原文地址:http://refined-x.com/2017/08/29/基于Vue实现后台系统权限控制/,转载请注明出处. 用Vue/React这类双向绑定框架做后台系统再适合不过,后台系统相比普通 ...

  2. 蒙层嵌套pdf以及连接后台

    一.在本地浏览pdf(直接将element-dialog 和 iframe相结合)需要将要浏览的pdf放入static文件夹下面 <el-button type="text" ...

  3. 在addroutes后,$router.options.routes没有更新的问题(手摸手,带你用vue撸后台 读后感)

    参照<着手摸手,带你用vue撸后台>一文,本人做了前端的权限判断 https://segmentfault.com/a/1190000009275424 首先就是在addroutes后,$ ...

  4. Vue Admin - 基于 Vue & Bulma 后台管理面板

    Vue Admin 是一个基于 Vue 2.0 & Bulma 0.3 的后台管理面板(管理系统),相当于是 Vue 版本的 Bootstrap 管理系统,提供了一组通用的后台界面 UI 和组 ...

  5. 【转】手摸手,带你用vue撸后台 系列二(登录权限篇)

    前言 拖更有点严重,过了半个月才写了第二篇教程.无奈自己是一个业务猿,每天被我司的产品虐的死去活来,之前又病了一下休息了几天,大家见谅. 进入正题,做后台项目区别于做其它的项目,权限验证与安全性是非常 ...

  6. 【转】手摸手,带你用vue撸后台 系列三(实战篇)

    前言 在前面两篇文章中已经把基础工作环境构建完成,也已经把后台核心的登录和权限完成了,现在手摸手,一起进入实操. Element 去年十月份开始用vue做管理后台的时候毫不犹豫的就选择了Elemen, ...

  7. 【转】手摸手,带你用vue撸后台 系列四(vueAdmin 一个极简的后台基础模板)

    前言 做这个 vueAdmin-template 的主要原因是: vue-element-admin 这个项目的初衷是一个vue的管理后台集成方案,把平时用到的一些组件或者经验分享给大家,同时它也在不 ...

  8. 【转】手摸手,带你用vue撸后台 系列一

    前言 说好的教程终于来了,第一篇文章主要来说一说在开始写业务代码前的一些准备工作吧,但这里不会教你webpack的基础配置,热更新怎么做,webpack速度优化等等,有需求的请自行google. 目录 ...

  9. vue开发后台管理系统有感

    使用vue开发后台近一个月,今天终于完成得差不多了,期间也遇到很多的问题,所以利用现在的闲暇时间做个总结 使用element-ui基础,这次使用了vue-element-admin(github地址) ...

随机推荐

  1. HDU 1203 I NEED A OFFER!【01背包】

    解题思路:攒下的钱n相当于包的容量,然后是m个学校的申请费用,申请费用相当于每一个物品的消耗,得到offer的概率相当于每一个物品的价值. 因为要求的是至少得到一份0ffer的概率的最大概率,可以转化 ...

  2. Unity类继承关系 图

    UnityEngine(命名空间) 其他命名空间 其他类 Object(类) 其他类(继承自Object) Component(类)(继承自Object) 其他类(继承自Component) Tran ...

  3. 前端dom操作竟然使得http请求的时间延长了

    最近在项目中遇到了一个奇怪的问题:在google浏览器的调试窗口network下看到一个请求的时间一直是2s多,但是当我把这个请求单独拿出来执行的时候发现根本用不了2s,100多毫秒就完成了.最后再不 ...

  4. Codeforces Round #499 (Div. 2) C.FLY 数学推导_逆推

    本题应该是可以使用实数二分的,不过笔者一直未调出来,而且发现了一种更为优美的解法,那就是逆推. 首先,不难猜到在最优解中当飞船回到 111 号节点时油量一定为 000, 这就意味着减少的油量等于减少之 ...

  5. 一、frp官方中文文档

    frp 是一个可用于内网穿透的高性能的反向代理应用,支持 tcp, udp, http, https 协议. 目录 frp 的作用 开发状态 架构 使用示例 通过 ssh 访问公司内网机器 通过自定义 ...

  6. java SSM多操作注解回滚

    在业务操作时难免会遇到一个业务多操作,会用到事物回滚这里写了一个简单的多操作失败事物回滚案例 在这之前你需要在你的applicationContext-mybatis.xml中配置: <!-- ...

  7. s5pv210 fimc 之 fimc-dev.c

    fimc-dev.c 是Samsung FIMC 设备的V4L2 驱动.上层应用直接操作这个设备,进行capture,图片处理,以及overlay输出 http://blog.csdn.net/cxw ...

  8. python--(常用模块-2序列化)

    python--(常用模块-2序列化) 一.序列化: 把对象打散成bytes或者字符串. 方便存储和传输 序列化 把bytes或者字符串转换回对象. 反序列化 # dumps 序列化. 把对象转化成b ...

  9. VUE:事件处理和表单输入绑定

    事件处理 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...

  10. tp框架引入第三方sdk的经验总结

    tp框架开发常用到第三方的接口,这时候需要引入第三方的sdk.例如:微信扫码支付sdk,阿里大于的淘宝sdk等等 首先到官网上下载对应php的sdk文件,通常会有至少一个实例代码. 1 新建一个控制器 ...