ant design 两个datepicker 相互制约,为什么不生效,代码如下

发布于 2022-09-13 01:03:22 字数 1375 浏览 27 评论 0

如题

          <a-col v-if="searchExpand" :lg="6" :md="12" :sm="24"
                 :xs="24">
            <a-form-item label="开始账期:" name="beginBillingTime">
              <a-date-picker
                v-model:value="where.beginBillingTime"
                :disabled-date="disabledStartDate"
                placeholder="请选择开始账期"
                value-format="YYYY-MM-DD"
                class="ele-fluid"/>
            </a-form-item>
          </a-col>

          <a-col v-if="searchExpand" :lg="6" :md="12" :sm="24"
                 :xs="24">
            <a-form-item label="结束账期:" name="endBillingTime">
              <a-date-picker
                v-model:value="where.endBillingTime"
                :disabled-date="disabledEndDate"
                placeholder="请选择结束账期"
                value-format="YYYY-MM-DD"
                class="ele-fluid"/>
            </a-form-item>
          </a-col>


const disabledStartDate = (startValue) => {
  if (!where.beginBillingTime || !where.endBillingTime) {
    return false;
  }

  return startValue <= where.endBillingTime.valueOf();
};

const disabledEndDate = (endValue) => {
  if (!where.beginBillingTime || !where.endBillingTime) {
    return false;
  }
  return where.beginBillingTime.valueOf() >= endValue.valueOf();
};

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文