美文网首页
Vue时间格式化

Vue时间格式化

作者: 夕月红叶酱 | 来源:发表于2019-06-19 14:29 被阅读0次

1.html


vue   -- > {{date || dateString}} , 第二个为过滤器的名称。 可以再过滤器中对参数进行格式化。第一个参数为传入过滤器的value,也可以显示的指定参数进行传递 


<div id="test">

<h2>显示格式化的日期时间</h2>

<p>{{date}}</p>

<p>完整版:{{date | dateString}}</p>

<p>年月日:{{date | dateString('YYYY-MM-DD')}}</p>

<p>时分秒:{{date | dateString('HH:mm:ss')}}</p>

</div>

2.JS


    使用moment.js库对时间进行格式化操作


<script type="text/javascript" src="../js/vue.js"></script>

<script type="text/javascript" src="https://cdn.bootcss.com/moment.js/2.24.0/moment.js"></script>

<script>

//自定义过滤器

  Vue.filter('dateString',function(value,format){

return moment(value).format(format ||'YYYY-MM-DD HH:mm:ss')//对指定事件进行格式化

  })

new Vue({

el:"#test",

data:{

date:new Date(),

}

})

</script>

相关文章

网友评论

      本文标题:Vue时间格式化

      本文链接:https://www.haomeiwen.com/subject/mcckqctx.html