v-model绑定的值修改不了

最新推荐文章于 2024-04-24 10:16:09 发布
最新推荐文章于 2024-04-24 10:16:09 发布
阅读量1.3k 收藏
点赞数 3
文章标签： 开发语言 vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/azqsx12369/article/details/131725773
版权

问题

v-model绑定的值修改不了； 初始表单中owner打开时赋默认值当前用户，但是input无法修改了

<el-form-item label="负责人">
        <el-input v-model="configform.owner"></el-input>
 </el-form-item>     
 ……
 this.configform.owner = this.currentUser

原因

如果没有在data里面定义过的值是没有render的getter和setter属性的，因此也无法进行编辑

解决方式

  • 需要使用set初始赋值
//this.configform.owner = this.currentUser
this.$set(this.configform,'owner',this.currentUser)
Mander_Gao
关注
  • 3
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Vue内部指令 v-model
01-07
v-model 指令 用来在 input、select、text、checkbox、radio 等表单控件元素上创建双向数据绑定，根据表单上的值，自动更新绑定的元素的值 1.简单的双向数据绑定 html代码： {{message}} 请输入： 2.修饰符 ...
vue项目中v-model父子组件通信的实现详解
01-19
我们在vue项目中，经常有这样的需求，父组件绑定v-model，子组件输入更改父组件v-model绑定的数值。很多朋友对这种操作不是很清楚，这需要对v-model有比较深入的了解，今天谈谈v-model。 vue的双向数据绑定 v-model...
Vue循环中多个input绑定指定v-model实例
11-19
Vue.js中提供了v-model可以双向绑定表单元素,这个方法可以非常方便的获得输入的值,但是有时候表单元素需要循环生成,在循环中要怎样获得指定输入框的值呢 这里介绍两种： 一种是v-for中循环生成的输入框, 一种是在element-table中生成的输入框 在循环中只要给定的v-model不一致就可以为输入框分别绑定,在循环中index每一项都是不一样的,你也可以使用字符拼接的方式,设置v-model对应的值为input1,input2.. 类似这样的,这样就可以通过绑定的值取到对应输入框的值了, 在控制台打印的结果: 还有一种场景是在表格中嵌套的input: 这样的只用绑定表格的
el-input 给v-model赋了默认值后不能编辑
bollvzwxxiao的博客
12-22 1510
el-input 给v-model赋了默认值后不能编辑
关于v-model后续赋值后input中的值无法修改问题
最新发布
qq_66211468的博客
04-24 354
前情摘要，根据时间查询数据嘛，然后提出来一个新的需求，需要默认查询一小时的数据，我直接的想法是后端接口不改变，前端封装的api也不改，改变传入值的参数。
vue：input框使用v-model绑定值之后无法修改绑定值
热门推荐
W
10-07 1万+
日常给自己挖坑：搬来的砖，一个没注意的小细节就自己挖了个大坑 上代码： <el-form-item label="联系方式" prop="phone"> <el-input v-model="formLabel.phone"></el-input> </el-form-item> methods: { // 获取新增页面的默认电话号码 getAreaAndBankName() { apiRequest
element el-input输入框绑定值无法修改原因
weixin_55798503的博客
09-16 2629
大家多多指教
element ui组件赋值后部分组件修改数值无效情况解决
weixin_42192467的博客
06-28 2506
在使用过程中发现el-input-number无法输入，在网上搜资料，最终找到解决办法是在el-input-number上绑定@change=”changeVal($event)”
Vue-input输入框输不了值改不了-select多选，选了没效果，视图没更新
路虽远行则将至，事虽难做则必成。
04-23 1274
在实际开发中添加修改的form表单，不是什么时候都是都是一一对应绑定form值的。来回赋值，频繁的修改v-model绑定的值就会发现输入不了值，或者选中值没效果，这是因为视图没更新解决方案我们只需要调用vue 的forceUpdate()方法，每改变一次值就强制更新视图。input输入框更新方案@input在- Input 值改变时触发<el-inputselect多选选择器@change-值改变时候触发<el-selectplaceholder="请选择"<el-option。
ElementUI el-input无法输入、修改、删除问题解决
weixin_52394141的博客
12-01 1万+
使用 el-input 这个标签时，我有些情况下在 el-input 是无法输入的，绑定的值动也动不了，删也删不掉，改也改不了，所以我做了以下的解决方法的统计，希望可以帮助到大家！造成的结果就是从后端传来的数据只能显示在输入框中，不能改也不能删，所以大家也可以考虑一下这个情况，当然表单的数据最好也不要使用this，虽然不知道原理，但是问题确实出在this上，知道的友友请在评论区分享哦~3.我们有些时候可能会忘记加入v-model属性，来绑定输入框中的值，如果忘记加入了，记得补上。
vue中input的v-model清空操作
12-08
v-model 完成大部分数据双向绑定 <input type="text" :value="inputValue" @change="$emit('change',$event.target.value)" @blur="$emit('blur',$event.target.value)" @focus="$emit('focus',$event.target...
VUE table表格动态添加一列数据,新增的这些数据不可以编辑（v-model绑定的数据不能实时更新）
10-15
主要介绍了VUE table表格动态添加一列数据,新增的这些数据不可以编辑（v-model绑定的数据不能实时更新）,本文通过实例代码给大家介绍的非常详细，需要的朋友可以参考下
解决深拷贝v-model动态绑定问题，以及v-for里checkbox动态赋值问题
black1java的博客
03-18 705
记录关于CheckBox的坑
父子组件传值，子组件数据不更新
qq_48850466的博客
05-08 4412
项目场景： 提示：这里简述项目相关背景： 例如： 查看列表中的某一条，显示这条的详情信息–后台管理系统 问题描述 提示：这里描述项目中遇到的问题： 在父子组件传参时，父组件将值传到子组件后，子组件进行数据展示，在第一次传参时可以正常显示，第二次传值子组件的值就不更新了。 父组件 <div :parenData ="datas"></div> <script> data(){ return{ datas:"1" } }, methods:{ ch
《踩坑记录》v-model绑定数据能显示不能修改
Leporc的博客
03-14 3358
使用v-model绑定了数组中的值，输入框内能够显示数据，有光标显示，但是删除或者修改的时候就会报错 看到报错信息大概是属性是空的，无法读取arr，但是看控制台输出是能够输出值得，尝试过将所有属性都进行了定义 但是修改时还是报错，查看浏览器的vue插件 里面的值是有的，但是删除只能删掉最后一个字，再删就恢复了，但是是为啥始终搞不懂，最后终于查到了v-model里面是不能用this.绑定的 之后就能够正常修改了，尝试分析了一下，v-model的语法糖是 v-bind:val.
vue element 使用 oninput方法 v-model失效，值为 ‘’，无法绑定
Passerby_K的博客
01-06 2200
效果图： <el-input v-model.number='scope.row.stock' size="small" maxlength="3" show-word-limit oninput="value=value.indexOf('.') > -1?value.slice(0, value.indexOf('.') + 0):value.slice(0,3)" @blur="scope.row.stock=Number($event.target.value) "
vue框架 v-model双向绑定对象属性值不能修改的问题
qq_41102329的博客
07-05 5136
v-model绑定的值修改不了，
v-model无法更改值——vue项目，使用了watch，a-modal
我爱美女S的博客
09-23 2108
v-model无法更改值——vue项目，使用了watch，a-modal
elementUI中el-form-item中的label的样式修改方法
weixin_72681220的博客
11-19 9060
elementUI中el-form-item中的label样式修改方法
el-checkbox修改v-model的绑定值
04-28
El-checkbox是element-ui中的组件之一，在表单中，需要用到checkbox来选择多选项，这时候就需要将checkbox与v-model进行绑定。 El-checkbox中，v-model的绑定值默认为布尔类型，选中时为true，未选中时为false。当需要修改v-model的绑定值时，可以通过代码设置或者通过监听事件进行修改。 通过代码设置： 1.在data中定义一个变量作为v-model的绑定值，例如： data () { return { checked: false } } 2.通过el-checkbox组件的checked属性将checkbox的状态与变量进行绑定： <el-checkbox v-model="checked"></el-checkbox> 3.当需要修改绑定值时，在methods中定义一个方法，在该方法中对checked变量进行修改，例如： methods: { changeChecked () { this.checked = !this.checked } } 4.在el-checkbox组件中添加change事件并调用该方法： <el-checkbox v-model="checked" @change="changeChecked"></el-checkbox> 通过监听事件进行修改： 1.在el-checkbox组件中添加change事件，并传递当前checkbox的状态： <el-checkbox v-model="checked" @change="handleChange"></el-checkbox> 2.在methods中定义handleChange方法，接收checkbox的状态，并进行处理： methods: { handleChange (isChecked) { // isChecked 为当前checkbox的状态 // 进行修改绑定值的操作 } } 总之，无论是哪种方法，只要在修改了绑定值之后，el-checkbox组件就会根据绑定值的状态进行显示和隐藏。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值