首页 > 移动平台 > 详细

vue实例讲解之axios的使用

时间:2017-05-08 13:32:10      阅读:3418      评论:0      收藏:0      [点我收藏+]

本篇来讲解一下axios插件的使用,axios是用来做数据交互的插件。

这篇将基于vue实例讲解之vue-router的使用这个项目的源码进行拓展。

axios的使用步骤:

1.安装axios npm install axios --save-dev

2.页面中引入axios import axios from ‘axios‘

技术分享

3.为了方便使用我们将axios挂到vue.prototype.$http这个原型上

Vue.prototype.$http = axios

技术分享

4.在页面中直接调用axios的相关方法

技术分享

基础步骤理清楚之后,下面开始项目:

在项目的static目录下建立一个data文件,里面建立一个article.dada文件来存放模拟的数据。

结构如下:

技术分享

然后在入口文件main.js import axios

代码如下:

技术分享

接着在news.vue组件里面使用axios,以下是核心代码。

技术分享

完成之后页面效果如下:

技术分享

项目代码地址:

 

vue实例讲解之axios的使用

原文:http://www.cnblogs.com/xinggood/p/6824467.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!