Vue.js：如何动态更新变量的值

Question

我是新手，我想更新day变量值，这将在vuejs-datepicker中实现，如下图所示：

这是我的代码：

data() {
    var day = null
    
    var state = {
        disabledDates: {
            days: [day], // 0,1 (value of the day)
        }
    }
    return {

        state: state,
        day: day,
    }
},
watch: {
    'day': function(day){
        console.log('day: '+day)
        return this.day
    },
},

这是我期望的图像，当一天的值是0,1之后：

谢谢..

Answer 1

想要控制传递给日期选择器disabledDates的日期的声音。

为此，我将使用几天（0-6）的数组并为date-picker配置创建一个计算属性

export default {
  data: () => ({ days: [0, 1] }), // or whatever makes sense as a default value
  computed: {
    state: ({ days }) => ({
      disabledDates: { days }
    })
  }
}

您可以根据需要控制days属性。例如，使用复选框

<label v-for="(day, index) in ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']" :key="index">
  {{ day }}
  <input type="checkbox" v-model="days" :value="index">
</label>