vue input标签自定义参数绑定动态参数值方法内无法获取

最新推荐文章于 2023-11-08 17:10:58 发布
最新推荐文章于 2023-11-08 17:10:58 发布
阅读量2.6k 收藏
点赞数 1
文章标签： vue input inupt自定义属性 vue input自定义属性绑定动态值无法获取 自定义属性绑定的动态值无法获取
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43908083/article/details/93721114
版权

vue input标签自定义属性绑定动态属性值方法内无法获取

详情

不知道大家有没有遇到过这样的问题，最近我遇到过一次，就是在vue内使用input标签时，value可以绑定动态值也可以获取，但是自定义的属性绑定动态值后就是获取不到，打印的也是undefined，各种查资料也无法得到答案，也可能是自己的写法上出了问题。

最后实在是没办法了，灵机一动，自定义的不行，那么input上还可以有哪些原生的属性呢，哈哈哈，alt和title也可以啊，这俩万金油属性实在是再好不过了，最后选择了alt，顺利解决这个问题。至于为什么选alt不选title，你懂得的~哈哈哈

好了，最后问题解决了，但感觉还是不是最好的方法，欢迎大家提供更优的解决办法！！

凝望背负重剑的影
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
vue 设置所有的输入框只读_VUE.js实现动态设置输入框disabled属性
weixin_29894169的博客
01-13 5201
VUE.js实现动态设置输入框disabled属性需求背景页面从list列表展示，跳转到新增和修改的时候，新增和修改用的是同一个页面：add-or-update.vue。修改的时候用户的账号不能修改，因此需要将账号的输入框属性设置为"只读"。代码样例v-bind:disabled="dataForm.id!=0"dataForm.id初始值为0当修改操作时，dataForm.id是将要修改的那条数...
vue input标签通用指令校验的实现
12-13
移动端通常对于input标签要求输入有一些校验，vue的指令可达到完美校验的作用 预期效果 <input v-model="times" :data-last_value="lastTimes" v-int v-max="8" v-min="2" /> 属性data-last_value的值用来...
Vue 常用指令 v-on 自定义参数，事件修饰符
小楼一夜听春雨，深巷明朝卖杏花
07-28 461
之前跳过js jquery需要通过事件参数来判定触发的按钮是什么才可以限制触发的时机，但是在vue里面直接使用事件修饰符就行了。语法是点，后面跟上修饰符.enter就代表只要在回车键的时候才会触发这个逻辑。文本框，绑定了一个按钮事件，对应的逻辑是sayhi，现在无论按下什么按钮都会触发这个sayhi。但是实际上不是所有的按钮都会触发，只会限定某一些按钮，最常见的按钮就是回车键。限制触发的按键是回车键，使用事件修饰符，相对于之前需要结合事件参数来判断按下的按键，现在一个点就搞定了，这样更加灵活方便。
vue在自定义组件中使用v-model进行数据绑定的方法
01-19
本文介绍了vue v-model进行数据绑定，分享给大家，具体如下 官方例子https://vuefe.cn/v2/api/#model 有这么一句话： 默认情况下，一个组件上的 v-model 会把 value 用作 prop 且把 input 用作 event。 示例： 先来一个组件，不用vue-model，正常父子通信 <!-- parent --> <template> <p class=parent> <p>我是父亲, 对儿子说： {{sthGiveChild}}</p> <Child @returnBack=turnBack :give=sthGiveChild
jquery向input赋值有时会失效是什么原因
qq_27608711的博客
11-08 353
有时我们需要隐藏div input表单值,再通过jquery动态赋值出现失效的问题。document.getElementById("input").value="值";//下面这种写法不推荐，会失效，特别是他的父元素是dosplay:none时。$("#name").attr("value","值");//当父元素隐藏时，推荐使用attr写法赋值。$("#name").val("值");
关于JavaWeb中＜input value=“ “＞ 中动态获取值的问题
Hi逃的博客
08-06 1220
今天继续完善项目，实现的功能为通过前端传入的ID值修改员工的其他信息，发现动态获取ID值并以只读方式显示在输入框中取不到值，于是参考他人的项目发现如下问题： 图一为修改超链接，传入参数为对象获取的id，具体细节参照昨天的博文。 图二为对应函数，定位的目标为指定jsp页面并将获取到的id值绑定。 图三为接受的表单，在获取value的时候最初的写法为<%request.getParamete("id");%>。究其原因是对JSTL的具体含义未明确。 当修改了之后。 问题解决
vue里获取不到data_vue methods中取不到data值
weixin_39781550的博客
12-19 887
v圈调直年情，量的单框来离理这接法清都的为ue methods中取不到需朋朋支带不新器功几的事上为做的和时意后data值export default {name: "sysAdd",data() {return {form: {name: '',region: '',date1: '',date2: '',delivery: false,type: [],resource: '',desc: ''...
06vue 第一天入门使用
fly
11-22 238
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
vue @input带参数_Vue实战066：自定义指令及使用
weixin_39637589的博客
11-21 327
什么是Vue指令Vue指令是一种附加到DOM元素上的特性，通常以"v-"作为前缀来告诉Vue这是一种特殊的标记， 当渲染到该DOM时就会执行指令特性，以实现对HTML元素的一些行为控制。Vue内置了很多指令，下面列出一些常用的指令：除了默认核心指令Vue 也允许注册自定义指令，前面这篇文章Vue实战056：input框自动获取焦点中就用到了自定义指令的功能。在全局注册一个指令v-focus，然后在...
Vue组件自定义方法,传参
从盲流子到程序员
01-23 2064
&lt;template&gt; &lt;div id="app"&gt; &lt;ul&gt; &lt;li v-for="(item,index) in list" :key="index" &gt; {{item}} &lt;/li&gt; &lt;/ul&gt; &amp
vue @input带参数_Vue基础教程
weixin_39946274的博客
11-20 775
vue基础引入vue一个基本的vue程序 {{ message }}模板语法{{ messges}}模板语法, 支持丰富的表达式{{ msg +1 }}{{ ok? 'Yes' : 'No' }}{{ msg.split('').reverse.join('') }}使用v-once, 则模板中参数不会被之后的变动改变{{ msg }}v-html, 将数据以html方式解析:this sh...
vue.js自定义组件实现v-model双向数据绑定的示例代码
01-19
我们都清楚v-model其实就是vue的一个语法糖，用于在表单控件或者组件上创建双向绑定。 //表单控件上使用v-model <input type=text v-model=name /> <input type=checkbox v-model=checked/> <!-...
vue获取data数据改变前后的值方法
01-19
通过自定义指令将更新前的值绑定到对应自定义指令的元素的dataset上然后在vue文件里面通过ref获取到元素来获取旧的值 自定义指令就不多说了前面有写过以前相关的博客了这里直接上代码 自定义指令要新建一个js文件并...
vue中el-input绑定键盘按键(按键修饰符)
11-20
vue怎么写键盘事件 vue允许将按键值作为修饰符来使用，如...el-input监听不到键盘事件,原因是element-ui是封装组件，所以el标签属于自定义标签，因此触发不了键盘事件。 解决办法：加上.native原生事件修饰符即可。
Python课程设计 课设 手写数字识别卷积神经网络源码+文档说明.zip
04-24
高分设计源码，详情请查看资源内容中使用说明 高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明高分设计源码，详情请查看资源内容中使用说明
SpringBoot2.0快速开发框架权限.rar
04-24
SpringBoot2.0快速开发框架权限.rarSpringBoot2.0快速开发框架权限.rarSpringBoot2.0快速开发框架权限.rar
大语言模型的微调和推理baichuan7B, chatglm2-6B, Qwen-7B-chat源码.zip
最新发布
04-24
详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；详情请查看资源内容中使用说明；
基于Qt与STM32平台开发的汽车车机系统上位机
04-24
基于Qt开发的汽车车机系统上位机 & 常见类型汽车传感器信号模拟发生器 任务和要求： 任务： 根据发动机测控系统信号需求，设计一套发动机信号模拟器人机交互系统，能够根据需要向下位机输出控制信号，使其输出发动机测控系统需要的传感器模拟信号，给发动机测控系统的开发提供方便。 要求： 1.设计应包含上位机与下位机的交互程序及人机交互界面的设计，与下位机设计相结合，使其能够实现全部类型发动机传感器信号的模拟输出及显示。 2.设计中需要采用模块化开发程序。 3.所设计的人机交互界面简洁合理。 4.应考虑所设计系统的实用性。 具体工作内容: 1.根据设计目标，查阅相关设计标准和设计方法资料，对发动机信号模拟器设计中的关键工程原理和工程方法进行提炼，并围绕关键问题进行国内外设计现状调研，开展分析、评价与总结，确定主要研究内容，制定设计技术路线，制定设计计划(周进度)，撰写开题报告，并进行开题答辩，开题报告参考文献应不少于15篇(其中外文文献不少于 4 篇，近五年文献不少于三分之一)。 2.根据设计要求和技术指标，进行满足功能原理需求的多方案拟定，考虑安全、 标准等多因素进行技术性与经济性评价
实验-三、数据库安全性(目的、要求和模板).doc
04-24
实验-三、数据库安全性(目的、要求和模板).doc
vue2自定义指令中的el怎么获取input标签
05-24
在Vue2的自定义指令中，可以通过指令函数的第二个参数`binding`来获取指令绑定的元素。在`binding`对象中，可以通过`el`属性来获取指令绑定的元素。然后，可以通过`querySelector`等方法来获取该元素内部的`input`标签。 以下是一个示例代码： ```javascript Vue.directive('my-directive', { bind: function(el, binding) { // 获取input标签 const inputEl = el.querySelector('input'); // 对input标签进行操作 // ... } }) ``` 在上面的代码中，我们先通过`el.querySelector('input')`获取了指令绑定的元素内部的`input`标签，然后可以对`inputEl`进行操作。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值