Moment.js常用使用教程 vue3 TS框架下的使用方案

Moment.js 是一个强大的，用于解析、验证、操作和显示日期和时间的 JavaScript 库。在 Vue 3 和 TypeScript 环境下，你可以按照以下步骤使用 Moment.js：

首先，你需要安装 Moment.js。你可以通过 npm 或者 yarn 来安装：

npm install moment
# 或者
yarn add moment

如果你的项目在 TypeScript 下，你可能还需要安装类型声明文件，以便 TypeScript 能够理解 Moment.js 的 API：

npm install @types/moment
# 或者
yarn add @types/moment

然后，在你的 Vue 组件中，你可以这样使用 Moment.js：

<template>
  <div>
    <p>{{ formattedDate }}</p>
  </div>
</template>

<script lang="ts">
import { ref, onMounted } from 'vue';
import moment from 'moment';

export default {
  setup() {
    const date = ref('');

    onMounted(() => {
      date.value = moment().format('YYYY-MM-DD HH:mm:ss');
    });

    return {
      formattedDate: date,
    };
  },
};
</script>

在这个例子中，我们在 onMounted 生命周期钩子中，使用 moment().format('YYYY-MM-DD HH:mm:ss') 来获取当前日期和时间，并将其格式化为我们想要的格式。然后我们将这个值赋给一个 ref，这样我们就可以在模板中显示它。

Moment.js 提供了许多其他的功能，例如解析和操作日期，比较日期等。你可以查看 Moment.js 的文档 来了解更多信息。