Vue implementiert eine Wettervorhersagefunktion

 <div id="app">
        <div id="Suchleiste">
            <input type="text" v-model="Stadt" @keyup.enter="srch(Stadt)" id="ipt">
            <a @click=srch(city) id="btn">Suche</a>
        </div>
        <Navigation>
            <a href="#" @click="srch('北京')">Peking</a>
            <a href="#" @click="srch('上海')">Shanghai</a>
            <a href="#" @click="srch('Guangzhou')">Guangzhou</a>
            <a href="#" @click="srch('Suche')">Suche</a>
        </nav>
        <div id="res">
            <Tabelle>
                <tr>
                    <th v-for="item in forecasts">{{item.type}}</th>
                </tr>
                <tr>
                    <td v-for="Artikel in Prognosen">{{Artikel.niedrig}}~{{Artikel.hoch}}</td>
                </tr>
                <tr>
                    <td v-for="item in forecasts">{{item.date}}</td>
                </tr>
            </Tabelle>
        </div>
</div>

var app = new Vue({
        el: "#app",
        Daten: {
            Stadt: "",
            Prognosen: []
        },
        Methoden: {
            suche: Funktion (c) {
                var das = dies;
                axios.get("http://wthrcdn.etouch.cn/weather_mini?city=" + c).then(Funktion (Nachricht) {
                    diese.Stadt = c;
                    that.forecasts = Nachricht.Daten.Daten.Forecast;
                })
            }

        }
})

// Anfrageadresse: http://wthrcdn.etouch.cn/weather_mini
//Anforderungsmethode: get,
// Anfrageparameter: city (Städtename)
// Inhalt der Antwort: Wetterinformationen,

// 1. Enter drücken // 2. Daten abfragen // 3. Daten rendern var app = new Vue({
 el: '#app',
 Daten: {
  Stadt: '',
  Wetterliste: [],
 },
 Methoden: {
  sucheWeather: Funktion() {
   // console.log('Wetterabfrage');
   // konsole.log(diese.stadt)
   //Schnittstelle aufrufen//Speichern
   var das = dies;
   axios.get('http://wthrcdn.etouch.cn/weather_mini?city=' + diese.city)
    .dann(Funktion(Antwort) {
     Konsole.Protokoll(Antwort.Daten.Daten.Prognose)
     that.weatherList = Antwort.Daten.Daten.Prognose
    }).catch(Funktion(err) {})
  },
  changeCity: Funktion(Stadt) {
          //1. Stadt ändern //2. Wetter prüfen this.city=city;
     dies.serchWeather();
  }
 }
})