Question

我正在尝试通过将组件Datepicker与Vue.js结合使用来更新日历，但是我在添加和删除项目（在本例中为Date对象）方面遇到一些问题

我已经开发了两个javascript函数：一个用于向数组添加新的Date，另一个用于删除同一数组中的特定日期。关键是，在加载网站时，我可以完美地添加新日期并删除最初创建的日期。但是我不能做的是添加一个新日期然后将其删除，因为使用我开发的函数，用于返回数组中日期索引的方法将返回-1。

addDate: function(event) {
   var fecha = document.getElementById("inputFecha").value;
   var fecha2 = new Date(fecha);
   availableDates.push(fecha2);
},
deleteDate: function(event) {
   var collection = availableDates,
      d = new Date(event.getFullYear(), event.getMonth(), event.getDate()),
      idx;
   idx = collection.map(Number).indexOf(+d);
   if(idx!=-1){
      availableDates.splice(idx,1);
   }
}

还有我最初在同一文件中创建的一些日期：

var availableDates = [];
availableDates.push(new Date(2019, 2, 29));
availableDates.push(new Date(2019, 2, 30));
availableDates.push(new Date(2019, 2, 28));

我需要的是无需添加网站费用即可添加和删除的可能性。

Answer 1

致电new Date(2019, 2, 30)时，创建的日期为2019-03-30T00:00:00 在您的时区中 ...

~~而new Date("30/3/2019")将创建2019-03-30T00:00:00Z-即您所说的UCT / UTC / GMT / Zulu-如果您不在+0时区，则此操作将失败~~不确定我在这里想什么...完全垃圾：p

如果inputFecha是<input type="date">

addDate: function(event) {
    var fecha = document.getElementById("inputFecha").valueAsDate;
    var fecha2 =new Date(fecha.getFullYear(), fecha.getMonth(), fecha.getDate());
   availableDates.push(fecha2);
},

由于您添加MCVE失败，以下代码是一个粗略的假人，表明它确实有效

const availableDates = [];
let something = {
  addDate: function(event) {
    var fecha = document.getElementById("inputFecha").valueAsDate;
    var fecha2 = new Date(fecha.getFullYear(), fecha.getMonth(), fecha.getDate());
    availableDates.push(fecha2);
    console.log(availableDates);
  },
  deleteDate: function(event) {
    var collection = availableDates,
      d // = new Date(event.getFullYear(), event.getMonth(), event.getDate()),
    
    // dummy code to test
    var fecha = document.getElementById("inputFecha").valueAsDate;
    d = new Date(fecha.getFullYear(), fecha.getMonth(), fecha.getDate());
    // end dummy code
    
    const idx = collection.map(Number).indexOf(+d);
    if (idx != -1) {
      availableDates.splice(idx, 1);
    }
    console.log(availableDates);
  }
}
availableDates.push(new Date(2019, 2, 29));
availableDates.push(new Date(2019, 2, 30));
availableDates.push(new Date(2019, 2, 28));
console.log(availableDates);
document.querySelectorAll('.butt').forEach(btn =>
  btn.addEventListener('click', something[btn.id])
);

<input type="date" id="inputFecha">
<input type="button" class="butt" id="addDate" value="add">
<input type="button" class="butt" id="deleteDate" value="remove">

如何添加和删除数组中的Date对象？

1 个答案: