vue填坑系列之重置select选择器默认值

最新推荐文章于 2024-05-14 22:52:31 发布
最新推荐文章于 2024-05-14 22:52:31 发布
阅读量1.5w 收藏 4
点赞数 3
分类专栏： vue填坑 文章标签： vue填坑系列之重置select选择器默认值
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xuxinwen32/article/details/88319569
版权

 

具体的需求如下，在点击重置按钮的时候，我需要将select下拉框重置为初始值，输入框重置为空

 

 

 

 

 

 

打印输出值的时候会发现如果默认没有任何选中的状态下，直接将当前元素重置为空字符串就可以了

如下：

this.form.deviceNoVal = ''

this.form.deviceType = ''

 

 

如果重新赋值的话相当于填充那么就不是出事默认值的效果了，一定要注意

this.form.deviceNoVal = '请选择设备编号使用'

this.form.deviceType = '请选择设备类型'

 

 

每隔一段时间不定期更新中，本人菜鸟一枚，希望在vue填坑的路上能帮助到大家，有疑问欢迎留言···

 

 

 

 

 

xuxinwen32
关注
  • 3
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
专栏目录
在Vue中使用Select选择器拼接label的操作
01-18
我就废话不多说了，大家还是直接看代码吧~ 货道商品 prop=productid> 请选择 change=changeselect> <el-option v-for=item in myproducts :key=item.Id :label=`${item.Name}/${item.Bra
Vue组件之极简的地址选择器的实现
08-27
Vue 组件之极简的地址选择器的实现 本文主要介绍了 Vue 组件之极简的地址选择器的实现，通过对 Vue 组件的学习和应用，实现了一个极简的地址选择器。下面将详细介绍相关知识点。 数据更新 在 Vue 中，数据更新是...
jQuery 获取select选中值及清除选中状态
10-20
主要介绍了jQuery 获取select选中值及清除选中状态的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下
浅谈select数据回显并模拟触发选中事件及重置
赏樱看雪撸代码
05-04 987
获取被选中的value值及html值 1.重置为最初状态。第一条 $(".prosclear option:first").prop("selected", 'selected'); 2.Sleect事件改变后触发不同情况 $("#archivie_scheme").on("change",function(){}); //如下实例 //三种方式触发 $("#actionty...
el-select 默认选中值
最新发布
qq_33240556的博客
05-14 1800
绑定一个变量，并且初始化这个变量为想要默认选中的选项的值。组件用于创建下拉选择菜单。如果你想设置一个默认选中的值，你可以使用。在Element UI（一个用于Vue.js的UI框架）中，如果你想让“选项2”作为默认选中项，你只需在。这样，当页面加载时，“选项2”就会被默认选中。// 初始化这里为你想默认选中的值。
修改页面时，恢复select选项值（将Select option选项恢复为从后台传过来的值）
weixin_39450145的博客
06-12 1295
1. 在html页面，给表单form起个name名字（form1），给选择框select的name起个名字（type）。2. 在html的script中，写一个函数。当页面加载时，遍历select中的option值，如果这个option等于从后台传过来的值，那么将选中的值设置为selected=”selected”。3. 这样，就可以实现：在select下拉框中，恢复为从后台传过来的选项值。 ...
关于 VUE的select 初始值设置问题
weixin_33843409的博客
01-02 2652
2019独角兽企业重金招聘Python工程师标准>>> ...
SELECT标签重置
MoFe1的博客
12-20 1043
$(#mySelect option:first).prop(selected, 'selected')。 prop为赋值，select手动选择调用该方法 attr可取值可赋值
Vue Element 分组+多选+可搜索Select选择器实现示例
10-18
主要介绍了Vue Element 分组+多选+可搜索Select选择器实现示例,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
重置select select2下拉框为选中状态
xiaoshen_joyin的博客
08-12 7235
重置select2下拉框为初始状态/*重置select2下来框*/ $("#loc_city option:first").prop("selected", 'selected') $('#loc_city').trigger('change.select2'); // Notify only Select2 of changes
js重置select
lianflower的博客
03-13 1927
如果select中的第一个option，就是你的默认值，则使用： document.getElementById('selectId').selectedIndex = 0; 如果select中的非第一个option，是你的默认值，则使用： var options = document.querySelectorAll('#selectId'); for (var i = 0, l = options.length; i < l; i++) { options[i].selected = o
select重置清空以选取条件
热门推荐
qq_21246715的博客
03-09 1万+
$("#selkk").each(function (i, j) { $(j).find("option:selected").attr("selected", false); $(j).find("option").first().attr("selected", true); });
select下拉框设置默认值，可重新选择
weixin_45143987的博客
11-14 1198
Vue项目中使用select下拉框遇到的一点小问题 划水之余，想记录一下自己写的bug，哈哈哈哈哈… select下拉选择框默认值设置无效的两个原因: 默认绑定值与遍历数据的类型不一致，常见情况一个Number、一个String； 必须是先遍历再赋值设置默认值。 select下拉选择框设置默认值之后不能重新选择： 可能是因为Element中下拉框的state层次太深，数据更改没有触发render，解决方法$forceUpdate()强制更新视图。 ...
antd vue 多级select框实现与已选择内容重置
u012914342的博客
03-14 1529
需求：用axios请求数据1并在第一个select框中展现，当选择后请求数据2并在第二个select框中展现...以此类推。当上级框重新选择时需要重置所有下级select框并重新读取数据 template部分： data部分： mounted部分： method部分： 总结： @change可以接收选择框value值 使用v-model可以很好的解决select已选择项的重置问题 ...
Vue+Element下弹出框选择值后返回值的实现
humors221的专栏
03-13 2891
一、测试环境： 1.VUE 2.Element 二、功能描述： 弹出选择框，选择一条记录，点击确定，把记录的值返回到页面 三、关键代码： 1.父页面： <template> <el-button icon="el-icon-add" size="small" type="primary" @click="openDialog">选择</el-button> <el-dialog title="选择" :visible.sync="dialogVisi
JS操作表单select详解-选取当前值、重置option等
weixin_40524709的博客
10-19 3031
JS操作表单select详解-选取当前值、重置option等
html5中select选择框重置问题
evilcry2012的专栏
11-20 4620
html5中select选择框重置问题 [问题点数：40分]             不显示删除回复           显示所有回复            显示星级回复           显示得分回复            只显示楼主          收藏 yddcupid 墨上龙魂  结帖率：66.67%
select实现“重置“效果
monica1_1的博客
06-26 9986
前提说明：reset() 方法可把表单中的元素重置为它们的默认值。input默认值是null，而select未被选择的情况下是无默认值的（当然，你可以给它设定默认值）。那么怎么在select无默认值的情况下，实现重置效果，reset肯定是对它无效的。 按钮： <input class="btn btn-primary" type="reset" value="重置" onclick="...
ant-design-vue select选择器重置
qq_28016751的博客
03-11 4889
场景：触发"重置"按钮，将下拉框值所选值清除 问题：重置方法中this.organId=''或者null后，选择值时选择器选择值不显示 当你的select-option是循环出来的时候，你点击清空以后这个值是不会清空的，当你使用组件自带的api– allowClear的时候，你会发现清空以后是undefined，所以当你清空的时候，你可以在select标签上使用v-model。 <a-row> <a-col :span="12"> <a-for.
el-select选择器默认值
07-27
el-select选择器的默认值可以通过设置`v-model`来实现。在Vue中，可以将默认值绑定到一个data属性上，然后将这个属性作为`v-model`的值。例如： ```html <el-select v-model="selectedOption"> v-for=...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值