给日期类型过滤器设置不同格式

  • dayjs是一款轻量级的日期操作库 https://day.js.org/en
import Vue from 'vue'
import dayjs from 'dayjs' // {{ 表达式 | 过滤器 }}
// value: 表达式结果
// format: 格式,默认为 YYYY-MM-DD HH:mm:ss
Vue.filter('date', (value, format = 'YYYY-MM-DD HH:mm:ss') => {
return dayjs(value).format(format)
})
<span class="date">{{article.createdAt | date}}</span> <!-- 默认 -->
<span class="date">{{article.createdAt | date('MMM DD YYYY')}}</span> <!-- 月份简写 天 年 -->

Vue 过滤器 Filter传递参数的更多相关文章

  1. vue中 router-link 传递参数以及获取

    将所遇见的问题一步一步记录下来,不久便会成长 今天在修改前端(vue) BUG的时候遇见 router-link标签,传递参数到另一个页面,确不知道参数在另一个页面怎么接收,于是找度娘需求解决办法,最 ...

  2. vue 过滤器filter的详解

    1.代码运用的地方 <!-- 在双花括号中 --> {{ date | formatDate}} <!-- 在 `v-bind` 中 --> <div v-bind:id ...

  3. vue - 过滤器filter的基本使用

    1.全局过滤器 输出: 过滤器可以多次来调用 输出: 2.私有过滤器 <!DOCTYPE html> <html lang="en"> <head&g ...

  4. vue父子组件传递参数之props

    vue中父组件通过props传递数据给子组件, props有两种传递方式 1.props:['msg']2.props: { msg:{ type:String, default:"&quo ...

  5. vue 过滤器 filter 的使用

    1.局部过滤器的使用 比如性别,订单状态的数据,后端一般返回数字来代替状态.以性别为模拟数据,0是未知,1是男,2是女. 直接数据渲染出来,只有012,没有性别 根据后端返回的int类型值,前端对数据 ...

  6. Vue 过滤器入门

    Vue 允许自定义过滤器,可被用于一些常见的文本格式化 过滤器可以用在两个地方:双花括号插值和 v-bind 表达式 过滤器应该被添加在JavaScript表达式的尾部,由"管道" ...

  7. AngularJS过滤器filter入门

    在开发中,经常会遇到这样的场景 如用户的性别分为“男”和“女”,在数据库中保存的值为1和0,用户在查看自己的性别时后端返回的值自然是1或0,前端要转换为“男”或“女”再显示出来: 如我要换个羽毛球拍, ...

  8. vue的过滤器filter

    前记: 排版记录,未免太耽误时间,我就简单的来,下面是一个vue 过滤器的写法,demo 演示,限制一个字符串的长度. vue filter 的官网介绍 https://cn.vuejs.org/v2 ...

  9. Vue 给子组件传递参数

    Vue 给子组件传递参数 首先看个例子吧 原文 html <div class="container" id="app"> <div clas ...

随机推荐

  1. 【JVM之内存与垃圾回收篇】JVM与Java体系结构

    JVM与Java体系结构 前言 作为Java工程师的你曾被伤害过吗?你是否也遇到过这些问题? 运行着的线上系统突然卡死,系统无法访问,甚至直接OOMM! 想解决线上JVM GC问题,但却无从下手. 新 ...

  2. C# 判断和创建目录路径

    在进行一些导出或下载时,需要创建一个本地路径,以供文件进行下载和创建. if (Directory.Exists(Server.MapPath("~/upimg/hufu")) = ...

  3. 【JVM之内存与垃圾回收篇】堆

    堆 堆的核心概念 堆针对一个 JVM 进程来说是唯一的,也就是一个进程只有一个 JVM,但是进程包含多个线程,他们是共享同一堆空间的. 一个 JVM 实例只存在一个堆内存,堆也是 Java 内存管理的 ...

  4. Shell基本语法---if语句

    if语句 格式 #单分支 if [ 条件判断 ]; then 执行动作 fi if [ 条件判断 ]; then 执行动作 else 执行动作 fi #多分支 if [条件判断]; then 执行动作 ...

  5. Docker 入门教程(4)——docker-compse 服务编排

    Docker compose 简介 compose是用来定义和运行多个Docker容器. 比如一个简单的web项目,除了web服务之外,我们可能要需要数据库容器.注册中心容器等等.那我们需要: 定义各 ...

  6. vue+axios+springboot文件下载

    //前台代码 <el-button size="medium" type="primary" @click="downloadFile" ...

  7. 前端学习(十一):CSS性质

    进击のpython ***** 前端学习--CSS性质 那在CSS上还有一些很重要的性质:继承性,层叠性以及特殊性 那本小节就基于这三个性质进行展开... ... 继承性 在CSS的某些样式是具有继承 ...

  8. Squeeze-and-Excitation Networks(SENet)详解

    一.SENet简介 Squeeze-and-Excitation Networks(SENet)是由自动驾驶公司Momenta在2017年公布的一种全新的图像识别结构,它通过对特征通道间的相关性进行建 ...

  9. JavaScript 中的模块化

    JavaScript 中的模块化 最早的基于立即执行函数,闭包的模块化 const MountClickModule = function(){  let num = 0;  const handle ...

  10. springboot整合邮件发送(163邮箱发送为例)

    先登录163邮箱获取授权  勾选后安装提示会叫你设置授权密码之类的:记住授权的密码 1.引入maven依赖 <dependency> <groupId>org.springfr ...