【vue学习】 生命周期与filter，computed，watch

前文链接：初始vue

2.1 生命周期

---

生命周期大家都应该清楚，重点是记住两个

• created：数据初始化完成，可以进行数据获取操作ajax

• mounted：页面已经渲染完成，可以引入dom操作

2.2 filter【过滤器的介绍】

---

filters的应用在很多方面，例如：汇率，0男女的转化等等

现在我们有一个题目，是把获取到的数组里的 gender属性的0 ， 1转化成 女 男

 filters: {
       fmtGender(val) {
          if (val === 0) return '女'
          else if (val === 1) return '男'
          return '未知'
     }
 },

过滤器的应用甚多，还需要自己探索发现

2.3 computed

---

计算属性,直接上例子吧

computed:{
   maleList(){
	return this.userList.filter(r=>r.gender==='男')
    }，
   femaleList(){
	return this.userList.filter(r=>r.gender==='女')
    }
}

这样就可以把 v-for 里的 userList 给精确表示成 男，女

2.4 watch

---

监听器，监听值的变化

watch(val){
   if(val <= 1) val =1 
        this.count = val
    }

ok,周期函数和三器已经初涉完毕。