过滤器

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

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

  • <!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. c#根据文件路径启动进程

    //根据文件路径启动进程 private static void StartProcessByFilePath(string path) { Process p = new System.Diagno ...

  2. burp suite 基础入门超详细教程

    介绍: 都是我个人了解到的信息,,分享给大家 欢迎指正 burp suite 被誉为web安全工具中的瑞士军刀. 大家知道,瑞士军刀,都是体积小,功能强悍,.西方军队的标配.说这么多,只是想强调这款工 ...

  3. 通信协议：HTTP、TCP、UDP

    TCP   HTTP   UDP: 都是通信协议,也就是通信时所遵守的规则,只有双方按照这个规则“说话”,对方才能理解或为之服务. TCP   HTTP   UDP三者的关系: TCP/IP是个协议组 ...

  4. k64 datasheet学习笔记25--Multipurpose Clock Generator (MCG)

    0.前言 MCG模块为MCU提供了几种可选时钟源.模块包含一个FLL和一个PLL.FLL使用内部或外部参考时钟是可控的,PLL受外部参考时钟控制 模块可以选择FLL或PLL输出时钟,或内/外部参考时钟 ...

  5. Lua中字符串库中的几个重点函数

    [前言] 在<Lua中的一些库(1)>中也说到了,要对string库的模式匹配进行单独的讲解.对于字符串的处理,对于任何语言的学习来说,都是一个难点,而且也是一个必会的知识点.给你一个字符 ...

  6. 【原创】大叔问题定位分享（5）Kafka客户端报错SocketException: Too many open files 打开的文件过多

    kafka0.8.1 一 问题 10月22号应用系统忽然报错: [2014/12/22 11:52:32.738]java.net.SocketException: 打开的文件过多 [2014/12/ ...

  7. linux 乌班图 lnmp环境搭建

    1.#安装Apache2,目前163的源是2.2.22版本02.sudo apt-get install apache203. 04.#安装MySQL,目前163的源是5.5.24版本05.apt-g ...

  8. Django学习笔记(http协议与django安装)

    Django入门 HTTP协议 HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写,是用于万维网(WWW:World Wide Web )服务器与本地浏览器 ...

  9. JavaScript入门学习笔记（一）

    W3cJavaScript教程 JS是JavaScript的缩写,而JSP是Java Server Page的缩写,后者是用于服务器的语言. JavaScript代码写在标签<script> ...

  10. Windows caffe 跑mnist实例

       一. 装完caffe当然要来跑跑自带的demo,在examples文件夹下. 先来试试用于手写数字识别的mnist,在 examples/mnist/ 下有需要的代码文件,但是没有图像库. mn ...