vue中的时间过滤器

//全局过滤器,进行时间的格式化

//所谓的全局过滤器即使所有的vue实例都共享的

Vue.filter(‘dateFormat‘ ,function(dateStr, pattern=""){

//根据给定的时间字符串,得到特定的时间

  var dt = new Date(dateStr)

  //yyy---mm-dd

  var y = dt.getFullYear() //得到年份

  var m = dt.getMonth() + 1 //得到月份

  var d = dt.getDate() //得到日期

  // return y + ‘-‘ + m + ‘-‘ + d

  if(pattern.toLowerCase() ==="yyy-mm-dd"){

    return `${y}-${m}-${d}`

  }

   else {

    var hh = dt.getHours() //得到时

    var mm = dt.getMinutes() //得到分

    var ss = dt.getSeconds() //得到秒

    return `${y}-${m}-${d} ${hh}:${mm}:${ss}`

   }

})

原文地址:https://www.cnblogs.com/zimoyu/p/10962999.html

时间: 2024-10-19 20:09:34

vue中的时间过滤器的相关文章

vue中解决时间在ios上显示NAN的问题

最近在用vue,遇到倒计时在ios上显示为NAN的问题. 因为做的是倒计时支付,思路是获取服务器时间和下单时间,再转成秒级时间戳做差值. 在网上找到说是ios 不支持例如2018-09-01 10:00:59这种"-"连接符. 网上的解决是: var data = '2018-09-01 12:00:00' var time= Date.parse(new Date(data )) 然后用正则匹配改一下,将-替换为/ var date = '2018-09-01 12:00:00' v

vue中filters(过滤器)的使用

在vue中使用filters Vue.js自定义过滤器,可被用于一些常见的文本格式化.过滤器可以用在两个地方:双花括号插值和 v-bind 表达式.过滤器应该被添加在 JavaScript 表达式的尾部,由"管道"符号指示: <!-- 在双花括号中 --> <!-- message作为capitalize的第一个参数 --> {{ message | capitalize }} <!-- 如果有多个参数,message作为第一个参数,其它参数写在capit

vue中引入公用过滤器?

比如我们封装一个金钱的过滤器: 不废话,直接上代码 在main.js平级新建filter文件夹,里面新建index.js和money.js index.js import { moneyP } from './money' export default moneyP; 注意这里不要用module.exports导出了,会报错. // module.exports = { // normalTime // } money.js里面 function fmoney(s){ let n = 2; n

vue的filters时间过滤器

filters: { formatTime: function(value) { let time = new Date(value * 1000); let year = time.getFullYear(); let month = time.getMonth() + 1; if (month < 10) { month = "0" + month; } let day = time.getDate() < 10 ? "0" + time.getDa

第二章 Vue快速入门-- 25 过滤器-定义格式化时间的全局过滤器

1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="utf-8"> 6 <meta name="viewport" content="width=device-width,initial-scale=1.0"> 7 <title>Document</title> 8

Vue中,过滤器的使用方法!

Vue.js允许自定义过滤器,可被用于一些常见的文本格式化.过滤器可以用在两个地方:双花括号插值和v-bind表达式.过滤器应该被添加在JavaScript表达式的尾部,由“管道”符号指示:(借官方的来介绍下,接下来直奔主题) 1.定义全局过滤器!任何组件都能用. main.js中定义全局过滤器 // 定义长度为10的过滤器 Vue.filter('length10',(e) =>{ return e.slice(0,10) + '...' }) // 定义转大小写的过滤器 Vue.filter

vue中使用Ajax(axios)

Vue.js 2.0 版本推荐使用 axios 来完成 ajax 请求.Axios 是一个基于 Promise 的 HTTP 库,可以用在浏览器和 node.js 中. axios中文文档库:http://www.axios-js.com/zh-cn/docs/ 1.Axios简单使用 1.axios发送简单的get请求 后台: @RequestMapping("/index") @ResponseBody public Map index(HttpServletRequest req

vue03----生命周期、nextTick()、ref、filter、computed、vue中异步请求渲染问题(swiper不轮播)(在开发过程中遇到什么问题、踩过的坑)

### 1.vue的组件和实例都有生命周期,而且是一样的 生命周期:(组件从创建到销毁的过程) 创建 挂载 更新 销毁 组件到达某一个阶段就会自动触发某一些函数,这个函数就叫生命周期的钩子函数. 创建:组件创建的时候触发 beforeCreate created     组件刚创建的数据请求 挂载:创建完成挂载前后触发 beforeMount mounted     DOM的初始化操作 更新:数据发生改变的时候触发 beforeUpdate updated     数据的变化监听,尽量不要在这里

jQuery源码分析系列(33) : AJAX中的前置过滤器和请求分发器

jQuery1.5以后,AJAX模块提供了三个新的方法用于管理.扩展AJAX请求,分别是: 1.前置过滤器 jQuery. ajaxPrefilter 2.请求分发器 jQuery. ajaxTransport, 3.类型转换器 ajaxConvert 源码结构: jQuery.extend({ /** * 前置过滤器 * @type {[type]} */ ajaxPrefilter: addToPrefiltersOrTransports(prefilters), /** * 请求分发器 *