JS.vue小笔记-计算属性/侦听属性/vue生命周期函数

计算属性

、computed
、书写形式为函数
、有返回值
、使用的话是和data中值使用一样 {{revereMsg}}
、计算属性具有依赖性，如果原始值不发生变化，则不会执行，发生变化，会重新计算，执行次数和调用次数无关
、特定条件下，计算属性优于方法，方法是每调用一次就会执行一次
、应用场景，登录注册可以验证表单信息

  
  
  
  


  

    {{ msg }} ----- {{ reverseMsg }} ---- {{ reverseMsg }} ---- {{ reverseMsg }}---- {{ reverseMsg }}
    

       {{ telTip }}
    
  

侦听属性

、vue提供了检测数据变化的一个属性 watch
、也叫做监听属性
、在特定条件下，计算属性优于侦听属性

  
  
  
  


  

    
    
    {{ fullname }}
  

  
  
  
  


  

    
    
    {{ fullname }}
  

总结

任何复杂的业务逻辑，建议使用计算属性

vue生命周期函数

生命周期钩子函数
、vue的生命周期就是vue实例从创建到销毁的过程
创建–初始化数据–模板编译/挂载（更新）–销毁

、类型都是function

总共分为8个阶段：

beforeCreate（创建前）,

created（创建后）,created（）{}//数据请求

beforeMount(载入前),

mounted（载入后）,mounted（）{}//数据请求 +操作ｄｏｍ

beforeUpdate（更新前）,

updated（更新后）,updated（）{} //操作dom

beforeDestroy（销毁前）,

destroyed（销毁后）destroyed（）{} //不可以操作DOM

vue中的数据请求

fetch实现数据请求

、fetch可以直接使用，不需要引入任何东西
、语法
fetch（‘url’，{
//参数
method：’get‘，//如果改为post，则接收不到,get直接拼在地址栏
//post请求是通过 req.body 接收数据
}）.then(res => res.json()) //将promise对象转为json对象
.then(data = >{ })//得到请求的数据，执行后续的业务逻辑
、fetch（）返回的是promise对象

axios实现数据请求

、会自动把promise对象转换为json数据
、语法：

axios.get(‘url’,{

                     }).then(res = >{
                console.log(res.date)

})
、get请求直接url拼接
、post请求，{ 对象参数 }

========================================================