Vue?3?使用moment設(shè)置顯示時(shí)間格式的問題及解決方法
一. 問題: Vue3如何使用moment設(shè)置顯示時(shí)間格式。
二.分析問題：在Vue 3中，因?yàn)檫^濾器(filter)已經(jīng)被廢棄，取而代之的是全局方法(global method)。slot-scope也被棄用使用v-slot代替。無法使用過濾器設(shè)置顯示時(shí)間格式。
三. 解決問題。
（1）在vue ui安裝moment依賴，搜索安裝即可。
（2）.在Vue項(xiàng)目的主入口文件（通常是main.js）中，導(dǎo)入moment庫和要使用的全局方法。
import moment from 'moment'
const app = createApp(App)
app.config.globalProperties.$moment = moment;
app.config.globalProperties.$formatDate = (value) => {
if (!value) return '';
return moment(value).format('YYYY-DD-MM');
};使用：
<el-table-column label="創(chuàng)建時(shí)間" prop="adminCreatetime"><br> <template v-slot="scope">
{{ this.$formatDate(scope.row.adminCreatetime) }}
</template>
</el-table-column>vue3中如何使用moment
1、npm i momet
2、直接在用到的頁面 import moment from "moment"
3、直接在上邊就可用{{ moment(item.end_time).fromNow() }}//判斷這是多久之前
到此這篇關(guān)于Vue 3 使用moment設(shè)置顯示時(shí)間格式的文章就介紹到這了,更多相關(guān)vue moment時(shí)間格式內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
vue中實(shí)時(shí)監(jiān)聽div元素盒子的寬高方法
這篇文章主要給大家介紹了關(guān)于vue中如何實(shí)時(shí)監(jiān)聽div元素盒子的寬高的相關(guān)資料,在Vue中你可以使用Vue的計(jì)算屬性和偵聽器來動(dòng)態(tài)監(jiān)測元素的高度,文中給出了簡單代碼示例,需要的朋友可以參考下2023-09-09
vue如何監(jiān)聽對(duì)象或者數(shù)組某個(gè)屬性的變化詳解
這篇文章主要給大家介紹了關(guān)于vue如何監(jiān)聽對(duì)象或者數(shù)組某個(gè)屬性的變化,在Vue.js中可以通過watch監(jiān)聽屬性變化并動(dòng)態(tài)修改其他屬性的值,watch通過監(jiān)聽器函數(shù)接收新舊值,實(shí)現(xiàn)屬性間的數(shù)據(jù)聯(lián)動(dòng),需要的朋友可以參考下2024-12-12
這篇文章主要為大家詳細(xì)介紹了vue開發(fā)拖拽進(jìn)度條滑動(dòng)組件，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-09-09
vue項(xiàng)目引入Iconfont圖標(biāo)庫的教程圖解
這篇文章主要介紹了vue項(xiàng)目引入Iconfont圖標(biāo)庫的相關(guān)知識(shí)，非常不錯(cuò)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-10-10
通過fastclick源碼分析徹底解決tap“點(diǎn)透”
這篇文章主要介紹了通過fastclick源碼分析徹底解決tap“點(diǎn)透”問題的知識(shí)內(nèi)容，有興趣的朋友學(xué)習(xí)一下吧。2017-12-12
Vue 實(shí)現(xiàn)顯示/隱藏層的思路（加全局點(diǎn)擊事件）
這篇文章主要介紹了Vue 實(shí)現(xiàn)顯示/隱藏層的思路（加全局點(diǎn)擊事件）,本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2019-12-12
結(jié)合康熙選秀講解vue虛擬列表實(shí)現(xiàn)
這篇文章主要為大家介紹了結(jié)合康熙選秀講解vue虛擬列表的原理使用，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
Vue中.vue文件比main.js先執(zhí)行的問題及解決
這篇文章主要介紹了Vue中.vue文件比main.js先執(zhí)行的問題及解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-12-12
文章詳細(xì)介紹了HTML5 Canvas的模板區(qū)、樣式區(qū)和腳本區(qū)的使用方法,包括如何設(shè)置Canvas的寬高、水平居中、獲取Canvas元素、繪制圖形（直線、矩形、圓、文字）、轉(zhuǎn)換為Base64、下載圖片以及加載圖片并添加文字水印等操作2025-10-10
easycom模式開發(fā)UNI-APP組件調(diào)用必須掌握的實(shí)用技巧
uni-app基于VUE開發(fā)，通常組件的使用都是先安裝，然后全局或者局部引入，注冊(cè)，今天通過本文給大家分享easycom模式開發(fā)UNI-APP組件調(diào)用必須掌握的實(shí)用技巧，需要的朋友一起看看吧2021-08-08