axios.get().then(function(response){}).catch(function(err){})
get()发送请求，中间写请求地址
then()成功的回调函数
catch()失败的回调函数
输入城市按回车查询
注：
在回调函数中不能直接用this赋值，应先把this赋值给函数内的变量，再在回调函数中调用这个变量去改变他的值
axios的在线cdn：https://cdn.staticfile.org/axios/0.18.0/axios.min.js
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="app">
<h2>天气查询</h2>
<input type="text" v-model="city" @keyup.enter="search" >
<table v-if="list.length>0" >
<tr v-for="item in list">
<td>{{item.date}}</td>
<td>{{item.high}}</td>
<td>{{item.fengli}}</td>
<td>{{item.low}}</td>
<td>{{item.type}}</td>
<td>{{item.fengxiang}}</td>
</tr>
</table>
</div>
<script src="js/vue.js"></script>
<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
<script>
var app = new Vue({
el:"#app",
data:{
list: [],
city:''
},
methods:{
search:function(){
var that = this;
axios.get('http://wthrcdn.etouch.cn/weather_mini?city='+this.city).then(function(response){
console.log(response);
that.list = response.data.data.forecast;
console.log(that.list[0]);
}).catch(function(err){
console.log(err)
})
}
}
})
</script>
</body>
</html>
509
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
