`

vue 全局处理日期格式

    博客分类:
  • Vue
 
阅读更多
入口文件main.js加入
import Vue from 'vue'
import * as filters from './filters'

// register global utility filters.
Object.keys(filters).forEach(key => {
  Vue.filter(key, filters[key])
})


filter文件
export function parseBirthDate(time) {
  if (arguments.length === 0) {
    return null
  }
  if (time) {
    const _arr = time.split(' ')
    return _arr[0]
  } else {
    return ''
  }
}
我这里的filter只过滤了这一种类型,还可以加一些其他类型的


用到日期格式化的vue页面
正常获取值 {{ item }}

改为如下格式化
{{ item | parseBirthDate}}

分享到:
评论

相关推荐

    vue项目消息链接全局创建监听

    在Vue项目中,实现全局的消息链接监听主要涉及到了WebSocket技术,这是一种双向通信协议,允许客户端与服务器之间实时、高效地交换数据。以下是对标题和描述中所述知识点的详细说明: 1. **Vue.js**:Vue.js 是一个...

    Vue2x的下拉时间选择器小时分钟秒支持灵活的时间格式

    这可以通过使用`moment.js`或`date-fns`等库来处理时间格式化,或者使用Vue的`vue-i18n`插件进行全局的国际化设置。 6. **无障碍性**: - 对于无障碍性,确保组件遵循Web Content Accessibility Guidelines (WCAG)...

    【JavaScript源代码】vue使用过滤器格式化日期.docx

    在过滤器内部,我们可以使用JavaScript的Date对象及其方法来处理日期。例如,提取年、月、日等信息,并根据指定的格式进行拼接。这里使用了一个名为`dateFormat`的辅助函数,该函数接收日期和格式两个参数,然后...

    vue-calendar 日期插件分享

    在开发过程中,有时我们需要处理日期相关的功能,如显示日历、选择日期等,这时候就可以利用日期插件来增强应用的功能。"vue-calendar" 是一个专门为Vue.js设计的日历组件,它提供了一种简单而灵活的方式来在你的Vue...

    【JavaScript源代码】vue利用Moment插件格式化时间的实例代码.docx

    总的来说,Vue.js 结合Moment.js 可以轻松地处理和展示各种日期和时间格式,使得前端开发中的日期管理变得更加便捷和灵活。时刻保持对官方文档(http://momentjs.cn/)的查阅,能帮助你更好地理解和运用这个强大的...

    Vue的全局过滤器和私有过滤器的实现

    过滤器(Filters)是Vue中的一种机制,用于对数据进行处理和格式化,尤其在文本展示时非常有用。Vue允许我们创建自定义过滤器,分为全局过滤器和私有过滤器。 一、全局过滤器 全局过滤器在Vue应用中可以被所有组件...

    在vue里面设置全局变量或数据的方法

    在Vue.js框架中,设置全局变量或数据是十分常见的需求,这可以帮助我们在多个组件之间共享信息...然而,为了遵循良好的编程实践,建议在必要时才使用全局变量,并优先考虑使用状态管理工具如Vuex来处理复杂的状态共享。

    vue中怎么获取当前日期

    在Vue.js中获取当前日期是一项常见的任务,尤其在开发涉及日期和时间的Web应用...通过这些基础操作,你可以轻松地处理日期相关的业务逻辑。同时,结合其他的日期处理库,你可以实现更多高级功能,满足复杂的应用场景。

    vue的国际化实现,包括ant-design-vue与自定义的实现

    虽然`vue-i18n`已经足够强大,但有时可能需要自定义逻辑,例如处理特定的语言格式、日期和数字格式等。这可以通过创建自定义的`formatter`函数来实现,然后在`vue-i18n`的配置中注册。 8. **环境变量**: `...

    VUE3二次封装vuetify3的snackbar

    2. **使用 Composition API**: 封装可能使用了 Vue3 的 `setup` 函数来处理逻辑,如显示和隐藏 Snackbar 的状态管理,以及响应式属性的创建。 3. **TypeScript 支持**: 类型定义文件(`.d.ts`)可能已经创建,为 `...

    Vue触发式全局组件构建的方法

    本文将详细介绍如何通过触发式方法构建Vue全局组件,为开发者提供一种灵活且高效的组件管理方式。 ### 触发式全局组件构建的概念 触发式全局组件构建是一种组件管理策略,它不会在应用启动时就预先加载所有组件,...

    vuepicker一个基于vue20的picker组件

    VuePicker是一个专为Vue.js 2.0框架设计的组件,它提供了一种方便的方式来实现选择器功能,常用于日期选择、时间选择、地址选择等场景。Vue.js是由尤雨溪开发的轻量级前端框架,它以组件化、响应式和易用性著称,而...

    vuetimeago一个Vue的微型timeago组件

    `vue-timeago`支持自定义时间格式。你可以通过设置`locale`属性来更改语言,或者提供一个完整的配置对象来自定义各种时间间隔的文本: ```javascript Vue.use(Timeago, { locale: 'zh-CN', locales: { 'zh-...

    vue-multipage vue 模块化开发打包

    在Vue-multipage 的场景下,Webpack 被用来处理每个页面的独立模块,确保每个页面的资源只包含该页面所需的部分,降低加载时间,提升用户体验。 Vue-multipage 的核心功能包括: 1. **多页面配置**:你可以为每个...

    vue filter 完美时间日期格式的代码

    总结一下,Vue filter是Vue.js中一个强大的特性,它允许开发者自定义数据转换规则,尤其是在处理日期和时间格式化时非常有用。通过创建自定义过滤器,我们可以统一管理全局的时间日期格式,提高代码的可读性和可维护...

    vue的全局变量和全局拦截请求器的示例代码

    总结来说,通过全局变量、全局请求拦截器和全局路由守卫,我们可以有效地管理Vue应用的状态,统一处理网络请求,以及在用户导航时提供必要的控制。这些技术的运用提高了代码的可维护性和用户体验,是构建大型Vue应用...

    vuedatepickerlocal是Vue2一个漂亮的日期选择组件

    在Vue生态中,开发者经常需要处理日期选择这样的交互功能,而`vue-datepicker-local`就是这样一个专门为Vue2设计的本地化日期选择组件。这个组件不仅美观,还提供了丰富的功能,帮助开发者在构建应用程序时轻松实现...

    Vue全局loading及错误提示的思路与实现

    Vue全局Loading及错误提示的实现涉及到了前端应用中常见的用户体验优化和错误处理策略。在本文中,我们将探讨如何在Vue项目中实现这两种功能,主要基于axios库进行拦截器的设置。 首先,Vue全局Loading的目的是在...

    vue的vue-admin-demo模板

    在vue-admin-demo中,Vuex用于存储全局状态,比如用户信息、配置等。它提供了`actions`、`mutations`和`getters`来操作和访问状态,遵循单一数据源原则,确保状态的一致性。 3. **路由管理(vue-router)**:Vue-...

    Vue之mixin全局的用法详解

    全局`mixin`通常适用于那些在多个组件中都需要使用的通用功能,如日期和时间格式化、货币转换等。这样可以减少代码冗余,提高代码一致性。 **具体步骤**: 1. **定义`mixin.js`**:在单独的文件中定义`mixin`,...

Global site tag (gtag.js) - Google Analytics