vue生命周期和vue请求

一、生命周期   
      定义：从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期！
     1、创建之前： beforeCreate(){console.log(this.msg);},     初始化尚未完成，data数据，metheds方法都未挂在在vue实例上，一般用于页面重定向
     2、创建之后：created(){console.log(this.msg);},      第一个能操作data数据的生命周期，一般用于接口请求+数据初始化
     3、beforeMount(){console.log(3);// debugger},    虚拟dom挂载前，此时页面元素尚未更新
     4、mounted(){ console.log(4);},      dom元素挂载后，如果需要操作dom，可以在此生命周期执行
     5、beforeUpdate(){ console.log(5); },   得出结论： 当执行 beforeUpdate 的时候，页面中的显示的数据，还是旧的，此时 data 数据是最新的，页面尚未和 最新的数据保持同步
          updated(){console.log(6);},      可以执行0-多次     updated 事件执行的时候，页面和 data 数据已经保持同步了，都是最新的

    6、beforeDestroy    和   destroyed

二、vue-resource的使用     
    注意：引用的先后顺序是 - 先引用Vue的脚本文件，再引用vue-resource的脚本文件
    1、get请求和post请求 （格式）
  

created(){
    // get请求
    this.$http.get(this.baseUrl+'/weChat/applet/course/banner/list?number=4').then(res => {
       console.log(res);
       this.imgList = res.data.data
       })
    // post请求
    this.$http.post(this.baseUrl+'/weChat/applet/course/list/type',                         
   {type:'free',pageSize:10,pageNum:1},{ emulateJSON: true }).then(res =>{
       console.log(res);
       this.courseList = res.data.rows})
}

三、axios的使用  （格式）
      1、get请求
    

created（）{
     axios.get("http://1.117.81.216:8086/weChat/applet/course/banner/list?number=4").then(res=>{
       // console.log(res);
       this.imgSrc = res.data.data[0].imgUrlPc
       this.imgList = res.data.data
   }
)}

       2、post请求
      （1） 

axios.post(this.baseurl+"/weChat/applet/subject/list",{enable:1}).then(res=>{
    console.log(res);
})

      （2）

created（）{
      // 内置对象   这里面实现传参
      let formurl = new URLSearchParams()
      formurl.append('type','free')
      formurl.append('pageSize',10)
      formurl.append('pageNum',1)
      // post请求
      axios.post(this.baseurl+"/weChat/applet/course/list/type",formurl).then(res=>{
      console.log(res);
      this.courseList = res.data.rows
     })
 }