<template>
<!-- 所有的内容要被根节点包含起来 -->
<div id="home">
首页组件 <button @click="getData()">请求数据</button>
<hr>
<br> <ul>
<li v-for="item in list"> {{item.title}}
</li>
</ul> </div> </template> <script> /* 请求数据的模板 axios 的使用 1、安装 cnpm install axios --save 2、哪里用哪里引入axios */ import Axios from 'axios'; export default{
data(){
return {
list:[]
}
},
methods:{ getData(){ var api='http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1';
Axios.get(api).then((response)=>{
this.list=response.data.result;
}).catch((error)=>{
console.log(error); }) }
},
mounted(){ /*生命周期函数*/ this.getData(); } } </script> <style lang="scss" scoped> /*css 局部作用域 scoped*/ h2{ color:red
} </style>

axios请求数据完整的更多相关文章

  1. Vue之单文件组件的数据传递,axios请求数据及路由router

    1.传递数据 例如,我们希望把父组件的数据传递给子组件. 可以通过props属性来进行传递. 传递数据三个步骤: 步骤1:在父组件中,调用子组件的组名处,使用属性值的方式往下传递数据 <Menu ...

  2. vue之axios请求数据本地json

    写给自己的话:静态的json文件要记得放在static文件夹下,想打自己 1.下载插件 npm install axios --save 2.在main.js下引用axios import axios ...

  3. Vue框架Element UI教程-axios请求数据

    Element UI手册:https://cloud.tencent.com/developer/doc/1270 中文文档:http://element-cn.eleme.io/#/zh-CN gi ...

  4. ajax、fetch、axios — 请求数据

    jquery ajax jq 的ajax是对原生XHR的封装,除此以外还增添了对JSONP的支持.用起来非常方便 用法: $.ajax({ url:发送请求的地址, data:数据的拼接,//发送到服 ...

  5. Vue之axios请求数据

    引入文件 <script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"> ...

  6. axios请求数据

    1.安装axios模块 import axios from 'axios'; //安装方法 npm install axios //或 bower install axios 2.引入模块 直接引用: ...

  7. axios 请求数据跳转页面报'$router' of undefined问题

    代码: this.$axios.post("/auth", { 'username': this.username, 'password': this.password }).th ...

  8. 使用axios请求数据,post请求出错。因为axios传递的请求参数是json格式,而后端接口要求是formData

    解决办法1:(IOS兼容性有问题,不推荐使用) // json格式转为formData格式,因为某些接口的原因 function json2formData(jsonData) { var param ...

  9. Vue使用axios请求数据,默认post请求传参是json格式,但后台需要formData格式???

    最简单的方式,post请求参数json转formData…代码如下: 使用node的 qs 模块(推荐使用) 就是这么简单,在结合element ui表单一键提交涉及到,希望遇到的同学少走弯路,加油~

随机推荐

  1. 怎样制作一个 Python Egg

    from:http://liluo.org/blog/2012/08/how-to-create-python-egg/ 制作打包一个 Python Egg 并部署整个过程还蛮有意思的,下面小教程(这 ...

  2. 怎么给win10进行分区?

    新安装的win10系统的朋友,对于win10系统分区不满意应该如何是好呢?今天给大家介绍两种win10系统分区的方法,一个是windows自带分区管理软件来操作;另一个就是简单方便的分区助手来帮助您进 ...

  3. SSMS开发利器Sql Prompt

    一.前言 一个Sql Server 开发智能提示插件,方便查询表结果,避免了开发人员一个个敲查询语句.执行语句等,一起来看看吧. SQL Prompt 9.5 支持SSMS18 下载地址: 链接:ht ...

  4. win32gui.EnumWindows

    python2 import win32gui, win32con, win32api import time, math, random def _MyCallback( hwnd, extra ) ...

  5. only_full_group_by

    ERROR 1055 (42000): Expression #1 of SELECT list is not in GROUP BY clause and contains nonaggregate ...

  6. C++第三章课后作业答案及解析---指针的使用

    今天继续完成上周没有完成的习题---C++第三章课后作业,本章题涉及指针的使用,有指向对象的指针做函数参数,对象的引用以及友元类的使用方法等 它们具体的使用方法在下面的题目中会有具体的解析(解析标注在 ...

  7. Fzu-html1

    Fzu-趣考网-前端1 html 题目: 使用html写出h1~h6六种格式的hello world 使用html的table标签制作一个表格,存储本学期专业课程(参考教务处课表) 使用html的sc ...

  8. 洛谷 P816 忠诚 题解

    每日一题 day28 打卡 Analysis 这道题用线段树维护区间最小值很简单,因为没有修改所以连lazy_tag都不用,但是这道题可以用树状数组维护区间最小值,非常骚气. 线段树代码: #incl ...

  9. 020_Python3 File(文件) 方法

    1.open() 方法 Python open() 方法用于打开一个文件,并返回文件对象,在对文件进行处理过程都需要使用到这个函数,如果该文件无法被打开,会抛出 OSError. 注意:使用 open ...

  10. CF463D Gargari and Permutations dp

    给定 $n<=10$ 个 $1$~$n$ 的排列,求这些排列的 $LCS$. 考虑两个排列怎么做:以第一个序列为基准,将第二个序列的元素按照该元素在第一个序列中出现位置重新编号. 然后,求一个 ...