vue input双向绑定赋值，input有值不显示，出现一个提示

最新推荐文章于 2024-03-25 15:03:48 发布
最新推荐文章于 2024-03-25 15:03:48 发布
阅读量4.4k 收藏
点赞数 4
分类专栏： uniapp vue js 文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/jinjina_/article/details/121852485
版权
js 同时被 3 个专栏收录
11 篇文章 0 订阅
订阅专栏
vue
10 篇文章 0 订阅
订阅专栏
uniapp
3 篇文章 0 订阅
订阅专栏

vue input双向绑定赋值，input有值不显示，出现一个提示

The specified value “wxssdd23u992” cannot be parsed, or is out
of range. at view.umd.min.js:6

原因：

也许是input的type问题，number或者text的，检查一下

金啊琦啊
关注
  • 4
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
详解Vue.js和layui日期控件冲突问题解决办法
01-19
今天在用layui的日期控件的时候发现一个问题,就是form表单中的日期选择之后,如果后面的输入框再输入值,这个日期就会自动清空,导致没办法提交,研究之后发现是vue的model绑定和layui冲突产生的,事实上是vue无法动态...
vue明明有值却不显示的问题
翎墨袅
01-09 4852
遇过两次 一次是v-model明明有值却不显示因为值是固定的又可以用jq于是直接jq.text给显示出来了 第二次是uni-app v-for还是有值不显示原因猜测是因为套了多层request里面还有循环继续套(效率极低极不建议使用 一开始是遍历数组加字段但是v-for的时候就是不显示 但是执行方法的时候弹出是存在数据的 于是新建一数组付到新数组给v-for加索引 <view class="...
Web前端html的input框有value值,但是不显示
热门推荐
Inmaturity_7的博客
08-21 1万+
Web前端html的input框有value值,但是不显示 今天遇到一个令人头疼的问题，就是input框有value值，但它显示placeholder的值,删了placeholder，输入框直接空了。如下图： 我的jsp页面代码: <c:choose> <c:when test="${weicaiOnlineResume.experienceName ne null}"> <input type="text" name="companyName" valu
js:8612 The specified value “\u672A\u586B\u5199\u8EAB\u4EFD\u8BC1“ cannot be parsed, or这个解决方式
最新发布
tianxianghuiwei的博客
03-25 307
在你的情况下，可能是因为传递给.val方法的值是一个包含Unicode编码的字符串。你可以尝试手动解码这个Unicode编码的字符串，然后再传递给.val方法。这个错误可能是因为尝试在jQuery的.val方法中传递不正确的数值或者字符编码导致的。请确保传递给.val方法的值是合法的。这段代码将把包含Unicode编码的字符串转换为正常的文本，然后再将其传递给。这样可以避免解析错误或超出范围的问题。
vue input值既要绑定一个值又要显示接口给的值。
肖肖肖丽珠的博客
06-04 1950
如果input是一个的话我们之间可以命名 <input type="text" v-model="item" readonly="readonly"/> 然后data定义item。初始化的时候让他等于接口给的那个值就可以啦。但是如果input用在循环里面。 <spanv-for="(item1,key)in children":key="key" > <inputclass="el-input__inner" type="num...
使用 vue3-tel-input电话组件时，为什么通过v-model绑定的默认值无效而 通过:value绑定有效?
DataB的博客
07-15 672
绑定具有初始值的电话变量，但input框内显示的初始值为空？
解决Vue中下拉框v-model双向绑定后数据不显示的问题
qq_42362007的博客
07-09 2507
vue解决双向绑定外的赋值
富文本编辑器的双向绑定内容不显示的问题
qq_45767896的博客
10-28 1018
富文本编辑器的双向绑定内容不显示的问题
vue不用双向绑定获取input中的值
CheriseZhou的博客
07-26 1062
需要引入vue.js
Vue element input 双向绑定 修改对象的值无效
qq_43345846的博客
03-09 4224
看了这位老哥截的官方文档的一句话就瞬间开朗了： 借鉴的文章 Vue官方文档解释 我直接说说，是什么操作导致的无效： 我把一个对象赋值给data中的obj（真实情况是，我通过请求进行赋值）： data() { return { obj:{} } }, fun(){ this.obj = {test:'1'} } 但是我需要给这个obj，添加新的键值，所以在赋值结束之后，我又添加了一个属性 fun(){ this.obj = {test:'1'} this.obj.newkey = 'new'
解决vue项目input输入框双向绑定数据不实时生效问题
11-20
我就废话不多说了，大家还是直接看代码吧~ <input type=”text” maxlength=”11″ placeholder=”请输入联系人电话” v-model=”form.phone” />...或者绑定到data里边的一个字符串，也是可以解决
Vue.js实现双向数据绑定方法(表单自动赋值、表单自动取值)
12-01
1、使用Vue.js实现双向表单数据绑定，例子 <!--html代码--> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> &lt...
VUE table表格动态添加一列数据,新增的这些数据不可以编辑（v-model绑定的数据不能实时更新）
11-21
而纵向添加的数据，因为没有事先在 el-select v-modle=”” 里面定义好字段，定义好的option是通过v-for出来的(option是写死的就不会有这个问题)，就会出现选择后，select元素上无法展示，但是其实数值已经绑定上去...
uniapp switch按钮的使用
jinjina_的博客
11-09 7832
switch使用官方文档 https://uniapp.dcloud.io/component/switch 想要改变switch按钮的大小 <switch @change="switchChange" color="#3EC3E1" :checked="checkoutInfo.checked" style="zoom:.6" /> <switch @change="switchChange" color="#3EC3E1" :checked="checkoutInfo.checked
vue-element表单内使用上传文件，并和表单其他内容一起上传
jinjina_的博客
06-07 6253
vue-element 上传文件 表单内使用上传文件，并和表单其他内容一起上传 <template> <div class="addAppUpdate"> <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm"> <el-form-item label="版本号" prop="version"&
时间线vue，类似物流快递运单追踪
jinjina_的博客
07-31 2211
时间线vue，类似物流快递运单追踪 类似于elementUI的时间线，也可以直接使用 https://element.eleme.cn/#/zh-CN/component/steps 现附上图（本例是根据物流订单的运单追踪显示） 具体代码如下显示: 1. css样式 //css .dialogProcess { .text { font-size: 14px; } .item { margin-bottom: 18px;
记vue input框获取剪切板图片，进行上传
jinjina_的博客
07-01 668
记vue input框获取剪切板图片，进行上传 样式参考微博网页版私信聊天上传剪切板图片 <el-input type="textarea" :rows="4" placeholder="" ref="sendMsg" resize="none" v-model="contentText" @keydown.enter.native="keyDown" @input='changeInput' @focus="changeFocus" @paste.native.capture.prevent="
记一次测试webSocket的连接
jinjina_的博客
06-10 644
记一次测试webSocket的连接 注：使用node.js本地连接测试了一下，最后与后端进行连接（测试可通） 前端页面： 使用了elementUi库 <template> <div class="input-box"> <el-input type="textarea" :rows="4" placeholder="" ref="sendMsg" resize="none" v-model="contentText" @keyup.enter="sendTex
vue3 Input 双向绑定
04-29
在 Vue3 中，使用 v-model 指令可以实现双向绑定。下面是一个简单的示例代码： ```html <template> <div> <input v-model="message" /> <p>{{ message }}</p> </div> </template> <script> import { ref } from 'vue'; export default { setup() { const message = ref(''); return { message, }; }, }; </script> ``` 在上面的代码中，我们使用了 `v-model` 指令将 input 元素的值绑定到了 `message` 变量上，同时在页面上展示了 `message` 变量的值。 在 `setup` 函数中，我们使用了 `ref` 方法来创建了一个响应式变量 `message`，并将其返回。这样就可以在组件中使用 `message` 变量，并且当 `message` 变量的值改变时，页面上展示的值也会跟着改变。 需要注意的是，Vue3 中的 `v-model` 指令实际上是语法糖，它会自动展开为一个 `v-bind` 指令和一个 `v-on` 指令，因此我们也可以使用 `v-bind:value` 和 `v-on:input` 指令来实现双向绑定。例如： ```html <template> <div> <input :value="message" @input="message = $event.target.value" /> <p>{{ message }}</p> </div> </template> <script> import { ref } from 'vue'; export default { setup() { const message = ref(''); return { message, }; }, }; </script> ``` 在上面的代码中，我们使用了 `v-bind:value` 指令将 input 元素的值绑定到了 `message` 变量上，同时使用了 `v-on:input` 指令监听 input 元素的输入事件，并在事件处理函数中将输入的值赋值给 `message` 变量。这样也可以实现双向绑定。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值