过滤器

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

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

  • <!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. 用 python 写一个年会抽奖小程序

    使用 pyinstaller 打包工具常用参数指南 pyinstaller -F demo.py 参数 含义 -F 指定打包后只生成一个exe格式的文件 -D –onedir 创建一个目录,包含exe ...

  2. Aurora的安装和中文配置

    转载自: http://blog.csdn.net/wdkirchhoff/article/details/72903885 要用 Aurora 很烦躁. 时不时出问题... 看看以下转载的吧. Au ...

  3. [物理学与PDEs]第1章习题1 无限长直线的电场强度与电势

    设有一均匀分布着电荷的无限长直线, 其上的电荷线密度 (即单位长度上的电荷量) 为 $\sigma$. 试求该直线所形成的电场的电场强度及电势. 解答: 设空间上点 $P$ 到直线的距离为 $r$, ...

  4. WebService - 术语介绍

    一.WebService是什么? 1. 基于Web的服务:服务器端整出一些资源让客户端应用访问(获取数据) 2. 一个跨语言.跨平台的规范(抽象) 3. 多个跨平台.跨语言的应用间通信整合的方案(实际 ...

  5. 25)django-form使用

    目录 1)django form作用 2)django form使用 一:django form 作用 django form有两个作用:一是用户输入数据验证:二是生成html 1)用户输入数据验证, ...

  6. Python--可迭代对象,迭代器,生成器

    记得在刚开始学Python的时候,看到可迭代对象(iterable).迭代器(iterator)和生成器(generator)这三个名词时,完全懵逼了,根本就不知道是啥意识.现在以自己的理解来详解下这 ...

  7. Restful风格

    今天看到一个比较好的文章,记录一下: Restful风格API中用put还是post做新增操作有什么区别? 1 HTTP协议详解 HTTP协议通常承载于TCP协议之上,有时也承载于TLS或SSL协议层 ...

  8. Canvas 画占比图 解决canvas锯齿 bug

    案例如图: <section class=" chartWrap"> <div class="chartContent"> <di ...

  9. 参数ref与out

    通常我们向方法中传递的是值,方法获得的是这些值的一个拷贝,然后使用这些拷贝,当方法运行完毕后,这些拷贝将被丢弃,而原来的值不会受到影响. 这种情况是通常的,当然还有另外一种情况,我们向方法传递参数的形 ...

  10. Classification

    kNN1 # -*- coding: utf-8 -*- """ kNN : 최근접 이웃 """ import numpy as np # ...