Vue计算属性computed传参

712 阅读1分钟

需求:Vue计算属性computed传参

思路:利用闭包,让计算属性 formatTime 返回一个函数,往函数里面传递参数并且执行函数

template部分:
<span class="time">{{ formatTime(userInfo.expired_at) }} 到期</span>
js部分
computed: {
    formatTime(){
      return (timeStr) => {
        const d = new Date(timeStr);
        return `${d.getFullYear()}${d.getMonth()+1}${d.getDate()}日`
      }
    }
  },

拓展:也可以用过滤器来解决

<span class="time">{{ userInfo.expired_at | formatTime }} 到期</span>
Vue.filter('formatTime', (str) => {
  const d = new Date(str);
  return `${d.getFullYear()}${d.getMonth()+1}${d.getDate()}日`
})