目前项目中有一个场景,就是表格中显示下拉框,并且下拉框的值可以更改,更改后提交后台更新。因为这个操作比较重要,所以切换时会有一个提示框,提示用户是否修改,是则走提交逻辑,否则直接返回,什么也不做。

之前用ref="useState",在change方法中通过this.$refs['useState'].value,永远只能拿到一个1,不是我想要的值。

解决办法:给select的ref绑定row.id,保证唯一性,:ref="row.id",这样在方法里面就可以通过this.$refs[row.id].value获取到每条数据对应的preValue了。

Vue ElementUI表格table中使用select下拉框组件时获取改变之前的值的更多相关文章

  1. Select下拉框onchange事件获取option的value值

    首先方法中使用到了jqury,首先导入jqury的插件: 如果jqury的小插件没有的话,就去网上下载一个吧,jqury比原生的js使用起来方便了很多,这里也提供一个我的jqury的下载地址: jqu ...

  2. HTML中的select下拉框内容显示不全的解决办法

    HTML中的select下拉框内容显示不全的解决办法 今天,我遇到这样一个问题:查询栏中的下拉框中的内容过长,导致部分被覆盖了. 查询了一些资料,有的说用函数控制,有的说用事件控制,有的看不懂,有的实 ...

  3. 解决select 下拉框运行时总会有一个空值(空选项)的问题

    项目中用到很多下拉选项都会多出一个空选项,如图运行结果 总会有一个空值出现,解决办法如下: 效果如下: 添加图中框选的代码即可,我是在Angularjs中使用的,在不用框架的情况下: <opti ...

  4. firefox与chrome中对select下拉框中的option支持问题

    firefox可以直接修改option的字体样式,但是chrome中option的字体样式是继承select的,这个是在项目中遇到的,具体的可以看一下 http://www.cnblogs.com/r ...

  5. html中的select下拉框

    <select name="effective"> <option value="">请选择</option> <op ...

  6. 微信小程序 select 下拉框组件

    一.源码地址 https://github.com/imxiaoer/WeChatMiniSelect 二.效果图 录屏图片质量较差,所以大家会看到残影(捂脸) 三.组件源码 1. select.wx ...

  7. 非常实用的select下拉框-Select2.js

    在Web开发中,Select下拉框是常用的输入组件.由于原生的Select几乎很难通过CSS样式控制.一些好看的Select下拉框就只能通过模拟来实现.PHP程序员雷雪松给大家推荐一筐款不错的Sele ...

  8. 获取select下拉框选中的的值

    有一id=test的下拉框,怎么获取选中的那个值呢? 分别使用javascript方法和jquery方法 <select id="test"  name="&quo ...

  9. Combo( 自定义下拉框) 组件

    本节课重点了解 EasyUI 中 Combo(自定义下拉框)组件的使用方法,这个组件依赖于ValidateBox(验证框)组件 一. 加载方式自定义下拉框不能通过标签的方式进行创建.<input ...

随机推荐

  1. HDU - 4722 Good Numbers 【找规律 or 数位dp模板】

    If we sum up every digit of a number and the result can be exactly divided by 10, we say this number ...

  2. JBoss 5.x和6.x 反序列化漏洞(CVE-2017-12149)

    0x01 漏洞简介 该漏洞为 Java反序列化错误类型,存在于 Jboss 的 HttpInvoker 组件中的 ReadOnlyAccessFilter过滤器中.该过滤器在没有进行任何安全检查的情况 ...

  3. 内存耗尽后Redis会发生什么

    前言 作为一台服务器来说,内存并不是无限的,所以总会存在内存耗尽的情况,那么当 Redis 服务器的内存耗尽后,如果继续执行请求命令,Redis 会如何处理呢? 内存回收 使用Redis 服务时,很多 ...

  4. Python+OpenCV+图片旋转并用原底色填充新四角

    import cv2 from math import fabs, sin, cos, radians import numpy as np from scipy.stats import mode ...

  5. TypeScript Interface vs Types All In One

    TypeScript Interface vs Types All In One TypeScript https://www.typescriptlang.org/docs/handbook/adv ...

  6. free open movie API all in one

    free open movie API all in one movie API TMDb API The Movie Database https://www.themoviedb.org/docu ...

  7. React Hooks 实现一个计时器组件

    React Hooks 实现一个计时器组件 useEffect https://reactjs.org/docs/hooks-reference.html#useeffect import React ...

  8. bind & this & new & arrow function

    bind & this & new & arrow function this bind call apply new arrow function arrow functio ...

  9. git hooks & pre-commit

    git hooks & pre-commit

  10. 小程序 & taro 踩坑指南

    小程序 & taro 踩坑指南 微信开发者工具, 不支持 react bug https://github.com/NervJS/taro/issues/5042 solution just ...