插件axios基础用法

axios get post 使用 

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
  <input type="button" value="get请求" class="get">
  <input type="button" value="post请求" class="post">
  <script>
    document.querySelector(".get").onclick = function () {
      axios.get("https://www.autumnfish.cn/api/joke/list?num=4")
        .then(function (response) {
          console.log(response.data);
        }, function (err) {
          console.log(err);
        })
    }
    document.querySelector(".post").onclick = function () {
      axios.post("https://autumnfish.cn/api/user/register", { username: "xiaoming" })
        .then(function (response) {
          console.log(response);
        }, function (err) {
          console.log(err);
        })
    }
    
  </script>

获取一条随机笑话 

  <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
  <div id="app">
    <input type="button" value="获取笑话" @click="getJock">
    <p>{
  {joke}}</p>
  </div>
  <script>
    var app = new Vue({
      el: "#app",
      data: {
        joke: "很好笑"
      },
      methods: {
        getJock: function () {
          var that = this
          axios.get("https://autumnfish.cn/api/joke").then(function (response) {
            that.joke = response.data
          }, function (err) {
            console.log(response);
          })
        }
      },
    })
  </script>

获取天气 

<div id="app">
    <div>
      <input v-model="city" @keyup.enter="searchWeater" type="text" placeholder="请输入查询的城市">
      <input type="submit" value="搜索">
    </div>
    <div>
      <a href="javascript:;" @click="changeCity('北京')">北京</a></a>
      <a href="javascript:;" @click="changeCity('上海')">上海</a></a>
      <a href="javascript:;" @click="changeCity('广州')">广州</a></a>
      <a href="javascript:;" @click="changeCity('深圳')">深圳</a></a>
    </div>
    <ul>
      <li v-for="item in arr">
        <!-- {
  {item}} -->
        日期:{
  {item.date}}
        星期:{
  {item.week}}
        温度:{
  {item.narrative}}
      </li>
    </ul>
  </div>
  <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
  <script src="./main.js"></script>

var app = new Vue({
  el: "#app",
  data: {
    city: "",
    arr:[]
  },
  methods: {
    searchWeater:function(){
      that = this
      axios.get("http://ajax-api.itheima.net/api/weather?city=" + this.city).then(function(canshu){
        that.arr