过滤器可用在双花括号插值表达式和v-bind 1.在组件定义过滤器
filters: { capitalize: function (value)
{ if (!value) return ''
value = value.toString()
return value.charAt(0).toUpperCase() + value.slice(1) } }
实例:
<template>
<div>
御剑乘风来,除魔天地间!{{msg||upper}}
</div>
</template>
<script>
export default{
name:'',
data () {
return {
msg:'this is a message',
filters:{
upper(value){
// 获取字符串
if(!value){
// 如果为空返回
return
}
// 获取字符串
value=value.toStrng()
return value.charAt(0).toUpperCase()+value.slice(1);
//charAt(i)从0开始数第i个字符 splice(i)从i开始数第i个字符
}
}
}
},
created () {
},
computed:{
},
methods:{
}
}
</script>
<style lang='less' scoped>
</style>
2.在mian.js中全局定义过滤器
Vue.filter('capitalize', function (value) {
if (!value) return ''
value = value.toString() return value.charAt(0).toUpperCase() + value.slice(1) })
new Vue({ // ... })
实例: main.js中
vue.fliter('forMat',(data)=>{
var t=-new Date(data)
var yy=t.getFullyear()
var mm=(t.getFullMonth()+1).toString().padstart(2,0)
var dd=t.getDate().toString().padStart(2,0)
return `${yy}--${mm}--{dd}`
})
组件在插槽中使用
{{ scoped.row.timeOfEntry | forMat("YYYY-MM-DD") }}
获取特定时间的格式
new date()
now.getFullYear() // 获取完整的年份 2019
now.getMonth()+1 //获取当前月份(从0-11,0代表1月)
now.getDate() //获取当前日(1-31)
now.getDay() //获取当前星期X(0-6,0代表星期天)
now.getTime() //获取当前时间(从1970.1.1开始的毫秒数)
now.getHours() //获取当前小时数(0-23)
now.getMinutes() //获取当前分钟数(0-59)
now.getSeconds() //获取当前秒数(0-59)
now.toLocaleDateString() //获取当前日期 "2022/4/6"