element 日期组件限制可选范围 在data 里面 的pickerOptions 写this.data中的变量报错 这个该怎么写

Question

element 日期组件限制可选范围 在data 里面 的pickerOptions 写this.data中的变量报错 这个该怎么写？

Answer 1

【以下回答由 GPT 生成】

### 问题解决：

在Vue.js中使用element-ui的日期组件时，如果需要将data中的变量传入pickerOptions的话，需要使用computed属性来处理。

示例代码：

```javascript
<template>
  <el-date-picker
    v-model="currentDate"
    type="date"
    format="yyyy-MM-dd"
    :clearable="false"
    :picker-options="computedPickerOptions"
    :disabled-date="disabledDate"
    placeholder="选择日期"
    style="width: 140px; margin: 10px;">
  </el-date-picker>
</template>

<script>
export default {
  data() {
    return {
      currentDate: new Date(),
      dataVar: 'someValue'
    };
  },
  computed: {
    computedPickerOptions() {
      return {
        thisDataVar: this.dataVar,
        // other pickerOptions properties
      };
    }
  },
  methods: {
    disabledDate(time) {
      return time.getTime() < Date.now() - 8.64e7;
    }
  }
};
</script>

在以上示例中，我们通过computed属性将this.dataVar传入了pickerOptions中，并且还保留了原有的disabledDate方法。这样就可以避免报错了。

希望这样能帮助到您。

```

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^