ivew select组件 DatePicker组件的清空
<Form ref="formInline" :model="formInline" :rules="ruleInline" inline> <FormItem label="用户类型:" :label-width="80"> <Select clearable ref="oselect" v-model="formInline.original" style="width:200px"> <Option v-for="item in original" :value="item.id" :key="item.id">{{ item.name }}</Option> </Select> </FormItem> <FormItem label="开始时间:" :label-width="80"> <DatePicker clearable ref="startData" type="datetime" format="yyyy-MM-dd HH:mm:ss" @on-change="startTime" placeholder="选择开始日期" style="width: 200px" ></DatePicker> </FormItem> <FormItem label="结束时间:" :label-width="80"> <DatePicker clearable ref="endData" type="datetime" format="yyyy-MM-dd HH:mm:ss" @on-change="endTime" placeholder="选择结束日期" ></DatePicker> </FormItem> <FormItem> <div style="display: flex;"> <Button type="primary" @click="handleSubmit('formInline')">查询</Button> <Button @click="dataReset()" style="margin-left: 8px">重置</Button> </div> </FormItem> </Form>
select 清空
在 select 组件设置
clearable ref="startData"
调用方法
this.$refs.oselect.clearSingleSelect();
在DatePicker组件 清空
clearable ref="startData"
调用方法
this.$refs.startData.handleClear();
方法:
// 重置 dataReset() { //clearSingleSelect 清除select 框 this.$refs.oselect.clearSingleSelect(); this.$refs.startData.handleClear(); this.$refs.endData.handleClear() },
越努力越幸运