- Vue.js 中 props、data、computed、watcher 初始化顺序
initProps -> initMethods -> initData -> initComputed -> initWatch, 源码
data() {
let data = {
locale: {
direction: "ltr",
format: moment.localeData().longDateFormat("L"),
separator: " - ",
applyLabel: "Apply",
cancelLabel: "Cancel",
weekLabel: "W",
customRangeLabel: "Custom Range",
daysOfWeek: moment.weekdaysMin(),
monthNames: moment.monthsShort(),
firstDay: moment.localeData().firstDayOfWeek()
}
};
// TODO 这里的 props 究竟是放在 data 里面进行初始化好,还是放在生命周期中好呢?
data.inside__monthDate = new Date(this.startDate);
data.inside__start = new Date(this.startDate);
data.inside__end = new Date(this.endDate);
data.inside__hoverStart = new Date(this.startDate);
data.inside__hoverEnd = new Date(this.endDate);
data.in_selection = false; // in_selection means whether user click once, if user click once, set value true
data.open = false;
// update day names order to firstDay
if (data.locale.firstDay !== 0) {
let iterator = data.locale.firstDay;
while (iterator > 0) {
data.locale.daysOfWeek.push(data.locale.daysOfWeek.shift());
iterator--;
}
}
return data;
},