time.vue 509 B

123456789101112131415161718192021222324252627282930313233
  1. <template>
  2. <div class="msg-time">{{showTime}}</div>
  3. </template>
  4. <script>
  5. import dayjs from 'dayjs'
  6. export default {
  7. name: 'msgTime',
  8. props: {
  9. timestamp: {
  10. type: [String, Number],
  11. required: true
  12. }
  13. },
  14. computed: {
  15. showTime () {
  16. return dayjs(this.timestamp * 1).format('HH:mm')
  17. }
  18. }
  19. }
  20. </script>
  21. <style lang="scss" scoped>
  22. .msg-time{
  23. text-align: center;
  24. margin: 0 auto 10px;
  25. max-width: 50%;
  26. font-size: 12px;
  27. padding: 1px 18px;
  28. color: #b2b2b2;
  29. }
  30. </style>