vue过滤器和监听

过滤器
过滤器的主要作用 对数据的处理
获得一个时间 一般是时间戳格式 同一个时间显示不同的样子
对数据做处理 返回处理过的新数据
{{要过滤的数据 | (管道符号) 过滤器的名字}}
Vue.filter 参数1 过滤器名 参数2 是一个函数
函数的第一个参数data就是要过滤的数据 也就是管道符号前面的东西

  <div id="app">
    {{time|hehe}}<br>
    {{time|hehe('-')}}<br>
    {{time|hehe('、')}}<br>
    {{time|hehe('/')}}<br>
  </div>

Vue.filter('hehe',(data,params='.')=>{
  // 对数据做处理
  console.log('需要过滤的数据',data)
  let y= (new Date(data)).getFullYear()
  let m= (new Date(data)).getMonth()+1
  let d= (new Date(data)).getDate()
  // 处理数据
  // 一定要返回
  return  `${y}${params}${m}${params}${d}`
}) 
let vm=new Vue({
  el:"#app",
  data:{
    time:(new Date()).getTime()
  }
})

局部过滤器
组件或者实例里的配置项filters：{过滤器名，处理函数}

let vm=new Vue({
  el:"#app",
  data:{
    time:(new Date()).getTime()
  },
  filters:{
    'hehe':(data)=>{
       return '理发店'
    }
  }
})

监听watch
watch也是配置项的一种 主要功能就是监听数据的改变
特点： 有两个参数 一个是更新前的值 一个是更新后的值