<Form   ref="formInline" :model="formInline" :rules="ruleInline" inline>
<FormItem label="用户类型:" :label-width="">
<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="">
<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="">
<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()
},

ivew select组件 DatePicker组件的清空的更多相关文章

  1. iView - DatePicker组件神坑,如何处理?

    最近使用iView - DatePicker组件时发现一些问题,明明设置是正常的日期时间格式,当需要使用这个时间的时候,页面却显示 Fri Jun 09 2017 12:00:10 GMT+0800 ...

  2. element UI datepicker组件限制可选日期范围

    长话短说,简单粗暴上代码了,在element中的datepicker,可以自由选择日期,如下: 然后我们根据element 官网的文档,给datepicker组件动态改变 picker-options ...

  3. python 全栈开发,Day78(Django组件-forms组件)

    一.Django组件-forms组件 forms组件 django中的Form组件有以下几个功能: 生成HTML标签 验证用户数据(显示错误信息) HTML Form提交保留上次提交数据 初始化页面显 ...

  4. Vue.js学习 Item11 – 组件与组件间的通信

    什么是组件? 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能.在有 ...

  5. Vue之组件及组件通信

    组件之全局组件 //注意:需要在Vue实例化之前注册全局组件,使用Vue.component("组件名",{ template:`组件模板` }) Vue.component(&q ...

  6. Django---FORM组件.FORM组件的字段,FORM组件校验流程,FORM组件的全局和局部钩子,FORM和Model的组合

    Django---FORM组件.FORM组件的字段,FORM组件校验流程,FORM组件的全局和局部钩子,FORM和Model的组合 一丶FORM的介绍 1.生成页面可用的HTML标签 2.对用户提交的 ...

  7. Vue框架(二)——Vue指令(v-once指令、v-cloak指令、条件指令、v-pre指令、循环指令)、todolist案例、Vue实例(计算、监听)、组件、组件数据交互

    Vue指令 1.v-once指令  单独使用,限制的标签内容一旦赋值,便不可被动更改(如果是输入框,可以主动修改) <!DOCTYPE html> <html lang=" ...

  8. drf框架 - 三大认证组件 | 认证组件 | 权限组件 | 频率组件

    RBAC 基于用户权限访问控制的认证 - Role-Based Access Control Django框架采用的是RBAC认证规则,RBAC认证规则通常会分为 三表规则.五表规则,Django采用 ...

  9. Vue中父子组件通讯——组件todolist

    一.todolist功能开发 <div id="root"> <div> <input type="text" v-model=& ...

随机推荐

  1. iconfont的三种使用方式

    这篇文章主要介绍了iconfont的三种使用方式,需要的朋友可以参考下   在我们项目中经常要使用到iconfont,在此我们使用阿里巴巴矢量库提供的icon图标,此图标库足够为我们提供大量的图标,我 ...

  2. CSS入门基础学习二

    我们下午继续学习CSS的入门基础,搬上你的小板凳赶快进入吧! 一.背景(background) Background-color:背景颜色 background-image (背景图片) backgr ...

  3. 2019 上海网络赛 F Rhyme scheme (字典树DP)

    题目:https://nanti.jisuanke.com/t/41414 题意:求长度为n的第k个bell number  ,  就是第i位的选取范围在 1-(i-1)位的最大值 +1,第一位固定为 ...

  4. RabbitMQ生产者消费者模型构建(三)

    ConnectionFactory:获取连接(地址,端口号,用户名,密码,虚拟主机等) Connection:一个连接 Channel:数据通信信道,可发送.接收消息 Queue:具体的消息存储队列 ...

  5. html5 figure和figcaption

    figure标签和figcaption标签是html5新增的语义化标签. figure标签,html5语义化标签. 用于规定独立的流内容(图像.图表.照片.代码等等). figcaption标签,ht ...

  6. 【Java架构:进阶技术】——一篇文章搞掂:JVM调优

    Sun官方定义的Java技术体系: Java程序设计语言 各种硬件平台上的Java虚拟机 Class文件格式 Java API类库 来自商业机构和开源社区的第三方Java类库 JDK(Java Dev ...

  7. iOS逆向一个APP指令集

    一.脱壳获取.app文件 1.查询壳有没加密 otool -l  mac-o文件 | grep crypt 2.Clutch -i Clutch -d  num 3.脱壳后的位置 /private/v ...

  8. DG-V$MANAGED_STANDBY视图

    V$MANAGED_STANDBY displays current status information for some Oracle Database processes related to ...

  9. 测开之路七十七:shell之if、case、for、while

    选择语句(if语句) 大于:-gt判断目录是否存在:-d if [ 判断条件 ]; then statement1 Statement2elif [ 判断条件 ]; then statement1 S ...

  10. Bootstrap 学习笔记8 下拉菜单滚动监听

    代码部分: <nav class="navbar navbar-default"> <a href="#" class="navba ...