过滤器

对要显示的数据进行特定格式化后再显示

并未改变原本的数据，可是产生新的对应的数据

  • <!DOCTYPE html>
    
<html lang="en">
    
    <head>
    
        <meta charset="UTF-8">
    
        <title>10_Vue_filter</title>
    
        <link rel="stylesheet" type="text/css" href="./css/index.css">
    
    </head>
    
    <body>
    
        <div id="test">
    
            <p>{{curTime | timeFormat}}</p>
    
        </div>
    
        <script src="https://cdn.bootcss.com/moment.js/2.24.0/moment.js"></script>
    
        <script src="./js/vue.js"></script>
    
        <script>
    
            Vue.filter("timeFormat", function (value, timeType="YYYY-MM-DD HH:mm:ss") {
    
                let newValue = moment(value).format(timeType);
    
                return (newValue === "Invalid date")?"":newValue;
    
            });
    
            new Vue({
    
                el: "#test",
    
                data:{
    
                    curTime: ""
    
                },
    
                mounted(){
    
                    setInterval(()=>{
    
                        this.curTime = Date.now();
    
                    }, 1000)
    
                }
    
            });
    
        </script>
    
    </body>
    
</html>

vue_过滤器： 对要显示的数据进行特定格式化后再显示的更多相关文章

  1. 用texarea存储数据，查询数据库后原样显示在jsp中，包括空格和回车换行

    用texarea存储数据,查询数据库后原样显示在jsp中,包括空格和回车换行

  2. php页面加载完毕后再显示购买按钮

    php页面加载完毕后再显示购买按钮 $document.ready(function(){ $("#buybotton").show()})

  3. bootstrap的alert提示框的关闭后再显示问题

    bootstrap中有alert组件,如果点击关闭按钮后该组件会被删除而不是被隐藏,想再显示怎么办呢? bootstrap-alert.js源码片段: function removeElement() ...

  4. ASP.NET网络爬虫小研究 HtmlAgilityPack基础，爬取数据保存在数据库中再显示再自己的网页中

    1.什么是网络爬虫 关于爬虫百度百科这样定义的:网络爬虫(又被称为网页蜘蛛,网络机器人,在FOAF社区中间,更经常的称为网页追逐者),是一种按照一定的规则,自动地抓取万维网信息的程序或者脚本.另外一些 ...

  5. JMeter 通过CSV Data Set Config 中文参数化数据，插入数据库后中文显示乱码，解决办法

    问题描述: 1. 需要设置中文参数化,模拟post请求,通过配置元件 - CSV Data Set Config 进行设置. 2. 数据库数据显示乱码(实际数据为 “测试001”) 解决办法: CSV ...

  6. 小谢第37问：关于websocket推送进度，本地保存进度条，然后跳出页面进入后再显示的问题

    1.主要技术点:sessionStorage 会话存储进度 这里在使用之前,顺便说一下cookie.sessionStorage.localStorage 共同点:都是保存在浏览器端,且同源的. 区别 ...

  7. 使用swiper插件，隐藏swiper后再显示，不会触发自动播放的解决办法

    问题: 项目中有一个需求,当点击P1时,两个页面进行轮播.当点击P2时,页面不轮播. 设置好以后,点击P2,再点击P1,此时页面不能自动轮播,只能手动触发. 解决: 在轮播器配置里,配置observe ...

  8. swipe display: none后再显示，加载内容后，滑动失效问题

    只需要添加这两个属性即可: observer:true,//修改swiper自己或子元素时,自动初始化swiper observeParents:true//修改swiper的父元素时,自动初始化sw ...

  9. idea使用/***/单行注释格式化后会显示多行,如何能保持单行显示

随机推荐

  1. Maven 学习总结 （一）

    一.何为Maven 1.Maven是优秀的构建工具 maven的用途之一是用于构建,他是一个强大的构建工具,能够帮助我们自动化构建过程,从清理.编译.测试到生成报告,再到打包和部署. 他抽象了一个完整 ...

  2. Visual Studio图形调试器详细使用教程(基于DirectX11)

    前言 对于DirectX程序开发者来说,学会使用Visual Studio Graphics Debugger(图形调试器)可以帮助你全面了解渲染管线绑定的资源和运行状态,从而确认问题所在.现在就以我 ...

  3. 071、如何定制calico网络的IP池（2019-04-16 周二）

    参考https://www.cnblogs.com/CloudMan6/p/7571272.html   在前面的学习中,我们没有特别配置,calico会自动为网络分配subnet,当然我们也可以根据 ...

  4. JGUI源码：Accordion兼容IE8实现(3)

    本来不考虑IE8,但是还是有部分客户用的XP,有不代表没有,尽量做一下兼容处理1.before,after,要使用:不能使用:: 2.阻止冒泡 function stopPropagation(e) ...

  5. [译]Ocelot - Delegating Handlers

    原文 可以为HttpClient添加delegating handlers. Usage 为了添加delegating handler需要做两件事. 首先如下一样创建一个类. public class ...

  6. css 常用的绝对定位元素水平垂直居中的方法

    两种方法都能够实现: 1. div { height:80%; /*一定要设置高度*/ overflow:hidden;/*建议设置*/ margin: auto; position: absolut ...

  7. Linux 一块网卡配置多个IP的方法

    1:ifconfig eth0:0 192.168.211.200/24 up 2:ip addr add 192.168.211.201/24 dev eth0 labe eth0:1 man ip ...

  8. spring和mybatis的整合开发(基于MapperFactoryBean的整合开发（方便简单不复杂）)

    MapperFactoryBean是mybati-spring团队提供的一个用于根据mapper接口生成mapper对象的类. 在spring配置文件中可以配置以下参数: 1.mapperInterf ...

  9. dubbo线程模型

    dubbo的provider有2种线程池: IO处理线程池.(直接通过netty等来配置) 服务调用线程池. 如果事件处理的逻辑能迅速完成,并且不会发起新的 IO 请求,比如只是在内存中记个标识,则直 ...

  10. vue中怎么实现获取当前点击对象this

    应用场景 在评论列表中,有很多条评论(通过循环出来的评论列表),评论的文字有多跟少,默认展示2行超出显示点击查看更多,,要点击查看更多对当前的这条评论进行全部评论展示! 问题描述 要是在传统的点击事件 ...