在 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. css——权重叠加

    权重叠加 在下面的一段代码中,第一个样式body b有两个标签,第二个有一个标签b.两个中都有color,会应用哪一个呢?果是 那下面的代码会显示什么样的结果 结果是 应用的事body b中的colo ...

  2. day 06 数据类型的内置方法[数字类型,字符串类型]

    什么是可变还是不可变? 可变是值可以改变,但是ID不变,不可变是值变,ID也变. 1.数字类型 int 1.用途:年龄,号码,等级 2.定义:可以使用int()方法将纯数字的字符串转为十进制的整数 a ...

  3. Oracle-Trigger-Insert tableA and tableB

    create or replace trigger trg_a after insert ON a for each rowbegin   INSERT INTO b values(:NEW.ID,: ...

  4. Tire树总结(模板+例题)

    题目来自<算法竞赛设计指南> Tire树是一种可以快速查找字符串的数据结构 模板 #include<cstdio> #include<algorithm> #inc ...

  5. hive用mysql作元数据代替默认derby的hive-site.xml配置

    <property> <name>javax.jdo.option.ConnectionURL</name> <value>jdbc:mysql://s ...

  6. C#调用带结构体指针的C Dll的方法【转】

    发现一篇文章关于C#调用DALL动态链接库的函数的,复制下来学习用.感谢作者的分析,原文传送门:https://www.cnblogs.com/ye-ming/p/8004314.html 在C#中调 ...

  7. jquery让 readOnly失效的方法

    re.attr("readOnly","true"); re.attr("readOnly",false); 注意 :false不能带引号

  8. 各种List、Map、Set的比較

    前言:Java中用不同的数据结构(哈希表/动态数组/平衡树/链表)实现了不同的集合接口(List/Map/Set).大多数情况下,集合类被用于不须要线程安全地环境,所以后来的集合实现都没有再採用同步以 ...

  9. &lt;pre&gt;标签

     <pre>标签最主要的认识就是预格式化文本,被包围在 pre 元素中的文本一般会保留空格和换行符.而文本也会呈现为等宽字体.经经常使用于在网页中显示计算机源码. 1.格式化文本举例 &l ...

  10. TCP、HTTP协议的RPC

    TCP.HTTP协议的RPC 1.1 基于TCP协议的RPC 1.1.1 RPC名词解释 RPC的全称是Remote Process Call,即远程过程调用,RPC的实现包括客户端和服务端,即服务调 ...