Vue---从后台获取数据vue-resource的使用方法

最新推荐文章于 2024-05-08 19:52:18 发布

lelara

最新推荐文章于 2024-05-08 19:52:18 发布

阅读量1.5k

点赞数

分类专栏： Vue

本文链接：https://blog.csdn.net/lelara/article/details/84577962

版权

　　作为前端人员，在开发过程中，我们大多数情况都需要从后台请求数据，那么在vue中怎样从后台获取数据呢？接下来，我简单介绍一下vue-resource的使用方法，希望对大家有帮助。

一、下载vue-resource

　　1、npm install vue-resource --save -dev

　　2、github: https://github.com/pagekit/vue-resource

两种方式都可以下载，根据自己喜好进行选择。

二、引入文件

　　引入vue.js和vue-resource.js，注意先后顺序，先引vue.js。记住所有vue插件都需要在vue.js之后加载。

三、使用

　　我今天写了一个小demo，比较简单。

1.HTML

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4    <meta charset="UTF-8">
 5    <title>vue-resource请求数据</title>
 6    <link rel="stylesheet" href="../../node_modules/bootstrap/dist/css/bootstrap.min.css">
 7    <script src="../../node_modules/jquery/dist/jquery.js"></script>
 8    <script src="../../node_modules/bootstrap/dist/js/bootstrap.js"></script>
 9    <script src="../../node_modules/vue/dist/vue.js"></script>
10    <script src="../../node_modules/vue-resource/dist/vue-resource.js"></script>
11 
12 </head>
13 <body>
14 <div class="row" id="paper" style="padding: 20px">
15    <div class="col-lg-12 col-sm-12 col-xs-12">
16       <div class="widget radius-bordered">
17          <div class="widget-header bordered-bottom bordered-themeprimary">
18             <span class="widget-caption">票据信息列表</span>
19          </div>
20          <div class="wi

最低0.47元/天解锁文章

lelara

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
Vue---从后台获取数据vue-resource的使用方法

　　作为前端人员，在开发过程中，我们大多数情况都需要从后台请求数据，那么在vue中怎样从后台获取数据呢？接下来，我简单介绍一下vue-resource的使用方法，希望对大家有帮助。一、下载vue-resource　　1、npm install vue-resource --save -dev 　　2、github: https://github.com/pagekit/vue-re...
复制链接

扫一扫