vue的初始化页面

vue数据内容为接口请求

export default {
  name: "weather",

  created() {
    axios.get("/laravel/test").then(response => {
      var res = response.data;
      console.log(res);
      this.info_msg = res;
    });
  },
    data() {
    return {
         info_msg: null,
    };
  }

这里这个created让你先把数据拿过来 然后初始化data的info_msg 可以完成页面;列表的初始化。

误区:

  methods: {
    eat() {
      console.log("you eat");
      return "this is methods eat";
    },
    test() {
      console.log("you test");
      return "zxl";
    },
    getNewsList() {
      //   axios.get("/laravel/test").then(response => {
      //     var res = response.data;
      //     console.log(res);
      //     this.$options.data.info_msg = res;
      //   });
      //return i++;
      this.info_msg = i++;
    }
  },
  
  data() {
    return {
      info_msg:this.getNuewsList(),
    };
  }
};

在method声明请求方法,data中直接请求this.方法。 不成!!!
页面渲染不等你把数据抓捉来,直接渲染页面结束了 。把这个取数据放到created()搞定!!!

你可能感兴趣的:(vue)