ngsl8755 2022-02-09 10:54 采纳率: 70%
浏览 23
已结题

vue+antd查询,父按钮验证子时间控件

项目需求,时间三级联动控件是子控件,表单和按钮在父组件中,点击查询按钮,需要验证子控件中的“年”是否有值,如果没有选,需要提示选择年,如果有值,就正常查询,这个功能该如何实现,因为刚接触Vue,找了几个例子,但是都不成功。
子控件
  <div id="pointDate">
    <a-select class="year select" v-model="yearsModel" v-on:change="dateChange(1)" placeholder="年" style="width: 117px;">
      <a-select-option v-for="item in years" :key="item.value" :label="item.label" :value="item.value">
        {{item.label}}
      </a-select-option>
    </a-select>
    <span class="spacer">-</span>
    <a-select class="month select" v-model="monthsModel" v-on:change="dateChange(2)" placeholder="月" style="width:100px;">
      <a-select-option v-for="item in months" :key="item.value" :label="item.label" :value="item.value">
        {{item.label}}
      </a-select-option>
    </a-select>
    <span class="spacer">-</span>
    <a-select class="day select" v-model="daysModel" v-on:change="dateChange(3)" placeholder="日" style="width:100px;">
      <a-select-option v-for="item in days" :key="item.value" :label="item.label" :value="item.value">
        {{item.label}}
      </a-select-option>
    </a-select>
  </div>

父级

                <a-form class="ant-advanced-search-form" layout="inline">
                  <a-row :gutter="24" class="screenRow">
                    <a-col :span="24" style="padding-bottom: 8px;">
                      <a-form-item label="按时间段选择">
                        <a-range-picker
                          id="setDate"
                          format="YYYY-MM-DD"
                          :placeholder="['开始日期', '结束日期']"
                          @change='setDate'
                          :value='setDateValue'
                          :allowClear='false'
                        />
                      </a-form-item>
                    </a-col>
                    <a-col :span="20">
                      <a-form-item label="按时间点选择">
                        <dateSelect 
                          id="pointDate"
                          ref="pointDateRef"
                          v-on:listenToChildEvent="dateChange"
                        />
                      </a-form-item>
                    </a-col>
                    <a-col :span="4" :style="{textAlign: 'right'}">
                      <a-button type="primary" @click='timeGetList(1)'>
                        查询
                      </a-button>
                    </a-col>
                  </a-row>
                </a-form>
请问这种情况该如何做验证?
  • 写回答

1条回答 默认 最新

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 2月11日
  • 已采纳回答 2月9日
  • 创建了问题 2月9日

悬赏问题

  • ¥15 求购HI3519AV100开发板
  • ¥15 请问1553 RT怎么测试,没有BC有方法吗
  • ¥100 业务编程如何选择学习方向和内容?
  • ¥15 wamp3.3.5安装完成后图标正常显示绿色,鼠标左右键点击图标均无反应。求解决方法。
  • ¥15 鼠标点击的这条记录了什么?
  • ¥15 在写pid调速的程序时,电机始终维持最大速度
  • ¥15 【有偿】调用DXGI截图初始化失败,提示0xf 887a0004
  • ¥15 请问如何查看手机root记录?
  • ¥15 商城小程序订单号重复
  • ¥15 学校优化算法sbo和蚁群算法怎么结合