datepicker - vue.js + bootstrap datepicker 的动态开始日期

Question

我正在尝试在使用 vuejs 时为引导日期选择器实现动态开始日期。下面是我当前代码中的示例。使用 -30d 或格式为 01-01-2016 的日期，但不能使用 2016-01-01。

<input type="text" name="cancelDate" id="cancelDate" autocomplete="off" class="form-control form-control-small"
  v-model="sale.cancelDate"
  v-bind:class="{ 'has-error': !validation.cancelDate }"
  v-datepicker start-date="{{sale.saleDate}}" />
<p>{{sale.saleDate}}</p>

p 标签中的 {{sale.saleDate}} 是可访问的，并显示类似“1/27/2016”的日期。将“开始日期”更改为“数据开始日期”不起作用。在 datepicker 指令中，我有...

var self = this;
$(self.el).datepicker({
  startDate: self.params.startDate,
  endDate: self.params.endDate,
  todayBtn: "linked",
  autoclose: true
});

如何让开始日期动态显示？

Answer 1

我在这里发布了一个例子:

//script.js 
new Vue({
  el:"#app",
  data:function(){
    return { 
      startDate: moment().subtract(7, 'days').format('MM/DD/YYYY'),
      cancelDate: moment().format('MM/DD/YYYY')
    }
  },
  ready:function(){
    $('.datepicker').datepicker({ startDate: this.startDate });
  }
})


// index.html
<div id="app">
  <input class="datepicker" type="text" v-model="{{cancelDate}}" value="{{cancelDate}}" >
</div>

https://jsfiddle.net/nosferatu79/jfk97gp9/4/

希望这对您有所帮助...