Question

这就是我获取json数据的方法

"wrk_hours": [{"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Tuesday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Wednesday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Thursday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Friday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Saturday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Sunday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Monday"}]

所以，我需要安排它从星期一到星期日。如果有些日子不见了..我需要打印为关闭。我怎样才能从上述数据中获得相同的信息。

目前我正在做

<table bgcolor="#00FF00" width="100%" border="0" cellspacing="0" cellpadding="0" class="table table-hover table-bordered">
  <thead>
    <tr bgcolor="#577c14">
      <th v-for="(item,key) in work" :key="key">
        <span v-if="new Date().getDay()-1==key" class="today">{{item.day}}</span>
        <span v-else-if="new Date().getDay()==key" class="tomorrow">{{item.day}}</span>
        <span v-else class="all">{{item.day}}</span>
      </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td v-for="(item,key) in work" :key="key">
         <span v-if="new Date().getDay()-1==key" class="today">{{item.opens_at}} to {{item.closes_at}}</span>
        <span v-else-if="new Date().getDay()==key" class="tomorrow">{{item.opens_at}} to {{item.closes_at}}</span>
        <span v-else >{{item.opens_at}} to {{item.closes_at}}</span>
    </td>
    </tr>
         </tbody>
                </table>

但是，当我这样做时，数据在数据中的传播方式相同，我需要将数据排列为星期一，星期二，星期三......星期日。

有时。我得到数据

"wrk_hours": [{"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Sunday"},{"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Tuesday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Wednesday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Friday"},{"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Monday"}]

因此星期四和星期六这里都不见了。所以，我需要打印为关闭。那么，我怎样才能实现同样的目标。请帮忙o获得结果？

我的vue js代码是

new Vue({ 
 el: '#feed' , 
 data: { 
 data: [], 
 work: '',
 pid: ''
 }, 
 mounted() { 
this.$nextTick(function() {    
data['pid'] = this.pid;
 $.ajax({ 
 url: "https://need2spot.com/alpha/get/post/", 
 data: data,
 type: "POST",
 dataType: 'json', 
 success: function (e) { 
 if (e.status == 1) { 
  self.data = e.data;
  self.reviews = e.data['reviews'];
  self.work = e.data['wrk_hours'];
  console.log(self.wrk_hours)
}
}
});
}) 
 }, 
 })

Answer 1

您可以在显示数据之前操纵JSON。创建一个数组，以按照您想要的特定顺序维护日期列表。然后，将你的wrk_hours数组的日期与dayList数组匹配（使用Array.indexOf）。将结果推送到新数组中的特定位置。如果缺少特定的一天，newArray的索引将为空，否则它将按照您想要的特定顺序包含结果。

function getNewArray(object){
  newData = []
  object.forEach((obj) => {
	  index = days.indexOf(obj.day.toLowerCase())
	  newData[index] = obj
  })
  return newData
}
data = {"wrk_hours": [{"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Tuesday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Wednesday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Thursday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Friday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Saturday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Sunday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Monday"}]}

//Order in which you want days list to be created
days = ["monday", "tuesday", "wednesday", "thursday", "friday", "saturday", "sunday"]

console.log(getNewArray(data.wrk_hours))

data2 = {"wrk_hours": [{"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Sunday"},{"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Tuesday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Wednesday"}, {"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Friday"},{"opens_at": "09:00:00", "closes_at": "23:00:00", "day": "Monday"}]}

//If thurday is not present, the new array will have that index empty. You can check for it to print closed
console.log(getNewArray(data2.wrk_hours))

希望有所帮助

如何安排json数据？

1 个答案: