使用ant-design-vue(select)遇到的问题,解决重置之后清空值

news/2024/7/10 22:42:42 标签: vue.js, javascript, es6

当你的select-option是循环出来的时候,你点击清空以后这个值是不会清空的,当你使用组件自带的api – allowClear的时候,你会发现清空以后是undefined,所以当你清空的时候,你可以在select标签上使用v-model。

<a-select v-model="year" allowClear @change="changeYear" placeholder="请选择检查年份">
 <a-select-option
   v-for="(item,index) in listYear"
   :value="item.value"
   @change="changeYear"
   :key="index">{{ item.key }}</a-select-option>
</a-select>
data () {
	return {
		year: undefined,
		listYear: []
	}	
}
changeYear (e) {
  this.year = e
},
// 重置
searchResetData () {
     this.year = undefined;
  },

自己写一个检查年份(只有年)

 initSelectYear() {
   let yearRange = 10
   let yearThis = new Date().getFullYear()
   this.currYear = yearThis

   this.listYear = [{
     value: yearThis,
     key: yearThis
   }]
   for (let y = 1; y <= yearRange; y++) {
     this.listYear.unshift({
       value: yearThis - y,
       key: (yearThis - y)
     })
     this.listYear.push({
       value: yearThis + y,
       key: (yearThis + y)
     })
   }
 },

http://www.niftyadmin.cn/n/763865.html

相关文章

js indexOf的使用

今天遇到一个需求&#xff0c;俩个字符串第一个字符串是‘检查’&#xff0c;第二个字符串是‘检查单的问题啊啊啊啊啊’&#xff08;这俩个字符串是我瞎写的&#xff09; 我要的是如果这个字符串里面有检查这俩个字就给我返回来。 因为是获取到input框里边输入的值。所以就判断…

python map lambda表达式_Python的lambda表达式、filter、map、reduce等函数的用法

lambda是表达式&#xff0c;用于创建匿名函数&#xff0c;可以和filter、map、reduce配合使用。 本文环境Python3.7。 一、lambda表达式 lambda 只包含一个语句&#xff0c;用于创建匿名函数。 语法&#xff1a; lambda [arg1 [,arg2,.....argn]]:expression arg1 -- 参数&…

vue使用ant design vue 树型控件(tree)

遇到的需求就是一级结构不要checked框&#xff0c;二级结构也不要&#xff0c;三级结构才需要&#xff0c;那么需要怎么做呢&#xff0c;因为人家给的结构是这样子的 checkable这个是一定要加的&#xff0c;要不不会显示出来 <a-treev-model"checkedKeys"checkabl…

federation机制的最新发布_基于Federation实现Kubernetes跨集群应用调度实践

1 Kubernetes Federation介绍1.1 Kubenetes Federation概述Kubernetes Federation实现在混合云模式下统一管理多个跨region或者跨公有云供应商的Kubernetes集群&#xff0c;使Kubernetes应用支持在多个跨区域集群之间部署、调度以及同步&#xff0c;从而实现应用的高可用以及灾…

pythoncookie自动登录_Python使用cookie 免密登录了解一下

我们都知道 HTTP 是无状态的&#xff0c;用户每次打开 web 页面时&#xff0c;服务器都打开新的会话&#xff0c;而且服务器也不会自动维护客户的上下文信息&#xff0c;那么服务器是怎么识别用户的呢&#xff1f;这就是本文今天要讲解的内容。当服务端需要记录用户的状态时&am…

ant design vue(upload)上传文件不显示删除按钮

有一种办法是直接给a-upload加disbale <a-upload// 加这句代码就行了:disabled"(title 查看) || (status A)"// 还可以加这个 这个是组件自带:showUploadList{{showRemoveIcon:false}}:action"getUploadAction()"list-type"picture":header…

ant design vue 使用树形控件(tree)点击节点expand判断的方法

当你想使用这个组件的时候&#xff0c;但是你点击一级树的时候调用一个接口&#xff0c;点击二级树的时候在调用另一个接口&#xff0c;那你就需要在点击一级节点的时候不用调用二级节点。那需要怎么做的&#xff0c;说一下我的思路&#xff0c;如果大家有别的更简单的方法&…