Vue如何获取new Date().getTime()时间戳

 更新时间:2024年10月16日 08:48:07   作者:qianer0_0  
在Web开发中,前端使用Vue.js获取的是毫秒级时间戳,而PHP后端则是秒级时间戳,处理此类问题时,需要将PHP的时间戳乘以1000转换为毫秒级,以保证数据的一致性和正确的逻辑判断

vue获取new Date().getTime() 时间戳

在处理按钮显示的时候发现一个问题:

vue 通过new Date().getTime()获取时间戳返回的是13位数字,单位是毫秒;

php后台time()获取的时间戳是10位数字,单位秒;

所以在判断比较时需要将time()*1000 转换为毫秒再去比较

<el-button v-if="new Date(scope.row.end_time*1000).getTime()>new Date().getTime()"  size="mini" icon="edit" @click="editGroupsAction(scope.$index, scope.row)">编辑</el-button>

vue动态获取当前时间

获取当前时间:

<template>
  <div id="home">
    <span class="deadline">截止{{ gettime }}</span>
  </div>
</template>
 
<script>
export default {
  name: "Home",
  data() {
    return {
      gettime: "", //当前时间
    };
  },
 
  methods: {
    getTime() {
    var _this = this;
      let yy = new Date().getFullYear();
      var mm =
        new Date().getMonth() > 9
          ? new Date().getMonth() + 1
          : new Date().getMonth() == 9
          ? new Date().getMonth() + 1
          : '0' + (new Date().getMonth() + 1);
      var dd = new Date().getDate() < 10 ? '0' + new Date().getDate() : new Date().getDate();
      let hh = new Date().getHours();
      let mf =
        new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes();
      let ss =
        new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds();
      _this.gettime = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf + ':' + ss;
    },
    currentTime() {
      setInterval(this.getTime, 1000);
    },
   
  },
  mounted() {
    this.currentTime();
  },
};
</script>
 
<style scoped>
</style>

获取当前日期:

<template>
  <div id="home">
    <span class="deadline">当前日期{{ sendTime }}</span>
  </div>
</template>
 
<script>
export default {
  name: "Home",
  data() {
    return {
      sendTime: "", //当前时间
    };
  },
  mounted() {
    this.format();
  },
  methods: {
      format() {
                    const nowDate = new Date();
                    const date = {
                        year: nowDate.getFullYear(),
                        month: nowDate.getMonth() + 1,
                        date: nowDate.getDate(),
                    }
                    const newmonth = date.month > 9 ? date.month : '0' + date.month
                    const day = date.date > 9 ? date.date : '0' + date.date
                    this.sendTime = date.year + '.' + newmonth + '.' + day
 
                }, //获取当前时间
   
  },
};
</script>
 
<style scoped>
</style>

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 解决vue eslint开发严格模式警告错误的问题

    解决vue eslint开发严格模式警告错误的问题

    这篇文章主要介绍了解决vue eslint开发严格模式警告错误的问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • vue运行卡死的问题

    vue运行卡死的问题

    这篇文章主要介绍了vue运行卡死的问题及解决,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • Vue路由传参页面刷新后参数丢失原因和解决办法

    Vue路由传参页面刷新后参数丢失原因和解决办法

    这几天在开发中遇见的一个关于路由传参后,页面刷新数据丢失的问题,下面这篇文章主要给大家介绍了关于Vue路由传参页面刷新后参数丢失原因和解决办法,需要的朋友可以参考下
    2022-12-12
  • 在Vue 中实现循环渲染多个相同echarts图表

    在Vue 中实现循环渲染多个相同echarts图表

    这篇文章主要介绍了在Vue 中实现循环渲染多个相同echarts图表,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-07-07
  • 浅谈vue中resetFields()使用注意事项

    浅谈vue中resetFields()使用注意事项

    这篇文章主要介绍了浅谈vue中resetFields()使用注意事项,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-08-08
  • VUE前端实现token的无感刷新3种方案(refresh_token)

    VUE前端实现token的无感刷新3种方案(refresh_token)

    这篇文章主要给大家介绍了关于VUE前端实现token的无感刷新3种方案(refresh_token)的相关资料,为了提供更好的用户体验,我们可以通过实现Token的无感刷新机制来避免用户在使用过程中的中断,需要的朋友可以参考下
    2023-11-11
  • Vue Echarts实现带滚动效果的柱形图

    Vue Echarts实现带滚动效果的柱形图

    这篇文章主要为大家详细介绍了Vue Echarts实现带滚动效果的柱形图,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-04-04
  • uniapp中uni-load-more的使用方式

    uniapp中uni-load-more的使用方式

    这篇文章主要介绍了uniapp中uni-load-more的使用方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-05-05
  • 快速解决vue动态绑定多个class的官方实例语法无效的问题

    快速解决vue动态绑定多个class的官方实例语法无效的问题

    今天小编就为大家分享一篇快速解决vue动态绑定多个class的官方实例语法无效的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09
  • Vue源码学习defineProperty响应式数据原理实现

    Vue源码学习defineProperty响应式数据原理实现

    这篇文章主要为大家介绍了Vue源码学习defineProperty响应式数据原理实现,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-09-09

最新评论