uniapp时间戳转换年月日
时间: 2025-03-05 18:19:49 浏览: 88
### 实现时间戳转换
在 UniApp 中实现时间戳向 `年-月-日` 格式的转换,可以利用 Vue 的过滤器功能来简化操作。通过定义全局或局部过滤器,在模板中使用管道符 (`|`) 来调用这些过滤器完成数据格式化。
#### 定义过滤器函数
创建一个用于将 Unix 时间戳转换为指定日期字符串的方法:
```javascript
// 在 main.js 或者其他合适的地方注册全局过滤器
export default function (Vue) {
Vue.filter('formatDate', function(value, separator='-') {
if (!value) return '';
let date = new Date(parseInt(value));
let y = date.getFullYear();
let m = ("0" + (date.getMonth() + 1)).slice(-2);
let d = ("0" + date.getDate()).slice(-2);
return `${y}${separator}${m}${separator}${d}`;
});
}
```
此代码片段展示了如何编写一个名为 `formatDate` 的过滤器,它接受两个参数:一个是待格式化的数值型时间戳 `value`;另一个是可选的分隔符,默认采用连字符 `-`[^1]。
#### 使用过滤器显示格式化后的日期
当页面接收到服务器响应并获取到时间戳后,可以在视图层直接应用上述自定义过滤器来进行展示:
```html
<template>
<!-- 假设 item.create_time 是从服务端接收的时间戳 -->
<view class="example">
创建时间:<text>{{item.create_time | formatDate}}</text>
</view>
</template>
<script>
import { mapState } from 'vuex';
export default {
computed: {
...mapState(['items'])
}
};
</script>
```
这段 HTML 和 JavaScript 结合的例子说明了怎样在一个组件内运用之前定义好的过滤器去呈现经过处理过的日期信息[^3]。
阅读全文
相关推荐


















