VUE AntDesign DatePicker设置默认显示当前日期

你可以使用AntDesign DatePicker的defaultValue属性来设置默认显示当前日期。具体实现方法如下：

<template>
  <a-date-picker :defaultValue="moment()" />
</template>

<script>
import moment from 'moment';

export default {
  name: 'MyComponent',
  data() {
    return {}
  }
}
</script>

其中，moment()方法可以获取当前日期。将其作为defaultValue属性的值即可默认显示当前日期。

相关问题

VUE3+ AntDesign DatePicker设置默认显示当前日期，为什么点击打开日历会全部都被选中

在使用Ant Design DatePicker时，可以通过设置`defaultValue`属性来设置默认显示当前日期。例如：

<template>
  <div>
    <a-date-picker :defaultValue="new Date()"></a-date-picker>
  </div>
</template>

在上面的例子中，我们将`defaultValue`设置为当前日期，这样在页面加载时，DatePicker就会默认显示当前日期。

至于你提到的点击打开日历后全部都被选中的问题，这可能是因为你设置了`range`属性，导致选中了一段时间范围。如果你只需要选择单个日期，可以将`range`属性设置为`false`，例如：

<template>
  <div>
    <a-date-picker :defaultValue="new Date()" :range="false"></a-date-picker>
  </div>
</template>

这样就可以只选中单个日期了。如果你仍然需要选择时间范围，可以将`range`属性设置为`true`。另外，需要注意的是，`defaultValue`接受一个Date对象，而不是字符串。

VUE3+ Ant-Design-vue的第一 DatePicker设置默认显示当前日期第二个DatePicker默认当前日期的30天之后

好的，针对您的问题，我可以提供以下代码实现：

第一个DatePicker默认显示当前日期：

<template>
  <a-date-picker :default-value="moment()" />
</template>

第二个DatePicker默认显示当前日期的30天之后：

<template>
  <a-date-picker :default-value="moment().add(30, 'days')" />
</template>

需要注意的是，代码中用到了moment.js库，如果您尚未引入该库，请先引入。另外，代码中的a-date-picker是Ant-Design-vue中的DatePicker组件，需要先安装并引入Ant-Design-vue库。