Vue 将军事时间更改为标准时间

Question

我正在从中获取到达时间。在获取到达时间时，它使用整理军事时间。有没有办法在整理后将排序的时间值从军事更改为标准？todos.itemssortedArray function()

视图

<div id="app">

  <div v-for="todo in sortedArray">

    {{todo.items.arrivalTime}}

  </div>

   <!-- is there a way to convert to todo.items.arrivalTime as paragraph<p> below -->

  <br>

  <h1>

    <b>Convert Into</b>

  </h1>

  <br>

  <p>09:00 AM</p>

  <p>10:00 AM</p>

  <p>11:00 AM</p>

  <p>02:00 PM</p>

  <p>10:00 PM</p>

</div>

脚本

new Vue({

  el: "#app",

  data: {

    todos: [

      { id: "1", items:{arrivalTime: "1100"} },

      { id: "2", items:{arrivalTime: "1000"} },

      { id: "3", items:{arrivalTime: "1400"} },

      { id: "4", items:{arrivalTime: "0900"} },

      { id: "5", items:{arrivalTime: "2200"} },

    ]

  },

  methods: {

    toggle: function(todo){

        todo.done = !todo.done

    }

  },

  computed:{

    sortedArray: function() {

      console.log("inside sortedArray");

      function compare(a, b) {

        if (a.items.arrivalTime < b.items.arrivalTime)

          return -1;

        if (a.items.arrivalTime > b.items.arrivalTime)

          return 1;

        return -1;

          }

      return this.todos.sort(compare);

    }

  }

})

我试图使用并做出一些改变军事时间到标准时间，但它不起作用。以下是我上传的代码jsFiddleJsFiddle

https://jsfiddle.net/ujjumaki/m2sowbv9/19/

Answer 1

我有一个与上面非常相似的解决方案。他们更快。https://jsfiddle.net/goofballtech/gom4rvst/31/fromMilTime: function(time){&nbsp; &nbsp; &nbsp; if(parseInt(time) <= 1259){&nbsp; &nbsp; &nbsp; &nbsp;return `${time.slice(0,2).padStart(2, '0')}:${time.slice(2).padStart(2, '0')} AM`&nbsp; &nbsp; &nbsp; }else if (parseInt(time) >= 1300 && parseInt(time) <= 2359){&nbsp; &nbsp; &nbsp; &nbsp; let math = parseInt(time) - 1200&nbsp; &nbsp; &nbsp; &nbsp; let temp = math.toString()&nbsp; &nbsp; &nbsp; &nbsp; return `${temp.slice(0,1).padStart(2, '0')}:${temp.slice(2,3).padStart(2, '0')} PM`&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }

Answer 2

这与 Vue 无关，但一般而言是关于 JavaScript 的。您正在寻找的解决方案是按字符拆分军事时间字符串并输入到日期对象的某个地方 - 如果您想要完整的信息。var hrs, min, result, time;time = '1100';hrs = time.slice(0, 2);min = time.slice(2, 4);console.log(hrs, min);result = new Date;result.setHours(hrs);result.setMinutes(min);console.log(result);这将为您提供一个完整的 Date 对象。从那里，您可以使用日期fns等库格式化时间。或者，如果您不需要稍后要添加一些时间的功能，需要知道日期等，则可以跳过所有这些功能并直接操作军事时间字符串。var hrs, min, result, time;time = '1100';hrs = time.slice(0, 2);min = time.slice(2, 4);if (parseInt(time) > 1259) {&nbsp; result = `${hrs - 12}:${min} PM`;} else {&nbsp; result = `${hrs}:${min} AM`;}console.log(result);另外，请注意，上述内容不一定是100%正确的。例如，我不确定目前12：59应该是你来自哪里的上午或下午，但我希望你明白它的要点。