}) / script / body / html 效果： 在输入框中输入城市
<html> <head> <script src="https://unpkg.com/axios/dist/axios.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <body> <div id="app"> <input type="text" v-model="city" @keyup.enter="getWeathers"> <button @click="getWeathers">盘问</button> <br> <br> <a href="#" @click="changeCity(‘北京‘)">北京</a> <a href="#" @click="changeCity(‘武汉‘)">武汉</a> <a href="#" @click="changeCity(‘上海‘)">上海</a> <a href="#" @click="changeCity(‘深圳‘)">深圳</a> <ul> <li v-for="(item, index) in weathers"> {{item.type}} {{item.low}} {{item.high}} {{item.date}} </li> </ul> </div> <script> var vue = new Vue({ el: "#app", data: { city: ‘‘, weathers: [], }, methods: { getWeathers: function () { var that = this axios.get(‘?city=‘ + this.city) .then(function (response) { that.weathers = response.data.data.forecast; }, function (err) { }) }, changeCity: function (city) { this.city = city; this.getWeathers(); }, }, }) </script> </body> </html>
效果：
在输入框中输入都市，例如武汉，，回车或者点击按钮盘问：
会显示相关信息。
点击下面的四个都市：
温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/web/29974.html
- 上一篇：大括号里面的字符串
- 下一篇： 所以现在很多的ajax等都使用json
![[转]Node.js中package.json中^和~的区别](/uploads/allimg/200519/054J34453_lit.png "[转]Node.js中package.json中^和~的区别")