Vue_自定义过滤器

谁践踏了优雅 2022-12-11 04:27 164阅读 0赞

过滤器：对数据进行筛选和过滤，可被用于一些常见的文本格式化，现使用自定义过滤器对时间进行格式化，使用双花括号插值来调用。

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
        <script src="https://cdn.bootcss.com/moment.js/2.21.0/moment.js"></script>
        <script type="text/javascript">
        /*
            自定义过滤器
        */
            window.onload = function(){
                Vue.filter('dateString',function(value,format= 'YYYY-MM-DD HH:mm:ss'){//ES6中的形参默认值，如果没传参则默认是它
                    return moment(value).format( format);
                    // return moment(value).format( format || 'YYYY-MM-DD HH:mm:ss');
                });//函数对象
                var app = new Vue({
                    el:"#app",
                   data() {
                       return {
                           date:new Date(),
                       }
                   }, 
                });
            };
        </script>
    </head>
    <body>
        <div id="app">
            <p>{
       {date}}</p>
            <p>完整的：{
       {date | dateString}}</p>
            <p>年月日：{
       {date | dateString('YYYY-MM-DD')}}</p>
            <p>时分秒：{
       {date | dateString('HH:mm:ss')}}</p>
        </div>
    </body>

发表评论取消回复

表情：

评论列表（有 0 条评论，164人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue_自定义过滤器

过滤器：对数据进行筛选和过滤，可被用于一些常见的文本格式化，现使用自定义过滤器对时间进行格式化，使用双花括号插值来调用。 <script src="https://c

谁践踏了优雅/ 2022年12月11日 04:27/ 0 赞/ 165 阅读

相关自定义过滤器

package com.kuang.filter; import javax.servlet.; import javax.servlet.h

àì夳堔傛蜴生んèń/ 2022年08月29日 10:05/ 0 赞/ 275 阅读

相关 Vue.js学习 Item14 – 过滤器与自定义过滤器

基础类似于自定义指令，可以用全局方法 `Vue.filter()` 注册一个自定义过滤器，它接收两个参数：过滤器 ID 和过滤器函数。过滤器函数以值为参数，返回转换后的

桃扇骨/ 2022年07月21日 01:16/ 0 赞/ 218 阅读

相关自定义过滤器

<!DOCTYPE html> <html> <head> <title></title> <script type="text/j

柔光的暖阳◎/ 2022年06月02日 11:10/ 0 赞/ 229 阅读

相关 Vue 全局自定义过滤器、过滤器公共调用

定义一个全局的自定义过滤器，需要使用Vue.filter()构造器。这个构造器需要两个参数。 Vue.filter() Constructor Parameters: 1.

冷不防/ 2022年05月14日 01:26/ 0 赞/ 391 阅读

相关 Vue中自定义过滤器及其使用

过滤器是一个通过输入数据，能够及时对数据进行处理并返回一个数据结果的简单函数。Vue有很多很便利的过滤器，过滤器通常会使用管道标志 “ | ”。使用: <td>{

￡神魔★判官ぃ/ 2022年04月18日 01:11/ 0 赞/ 234 阅读

相关 vue自定义时间过滤器之使用moment

一、安装moment.js npm install --save moment 二、自定义过滤器filter.js文件 //filter.js

迷南。/ 2021年09月16日 21:48/ 0 赞/ 449 阅读

相关 Vue入门-自定义过滤器

过滤器介绍 Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+

不念不忘少年蓝@/ 2021年09月15日 13:32/ 0 赞/ 420 阅读

相关 AngularJS过滤器以及自定义过滤器

过滤器是用来更改修改数据，并且可以在表达式或使用管道符指令将其归入。以下是常用的过滤器的列表。一.AngularJS的filter过滤器向表达式添加过滤器：可以通过

Bertha 。/ 2021年09月14日 06:54/ 0 赞/ 490 阅读

相关 Vue-自定义格式化时间的全局过滤器

在main.js中定义全局的时间过滤器 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aH

绝地灬酷狼/ 2021年07月25日 12:13/ 0 赞/ 457 阅读