微信小程序 input 动态修改对象数组中某一值

简介: 【8月更文挑战第15天】

微信小程序 input 双向绑定数组,很多场景需要动态修改数组中的某一值,如
xml中如下绑定数组arrayData:




1
2
3
4
data数据:

arrayData : [
{name : "mm", id : 1},
{name : "tt", id : 2}
]
1
2
3
4
'
运行运行
那么js中怎么设置,使其能够实现双向绑定呢?
正确的做法是:

onInput: function(e){
//数组浮标
var index = e.currentTarget.dataset.index
console.log(index)
//输入的值
var value = e.detail.value
//动态拼装设值的属性
var _target = arrayData[${index}].name
//赋值
this.setData({
//重要!!! 中括号[]必不可少,否则不生效
[_target] : value
})
//打印赋值后的数据数据
console.log(this.data.arrayData)
}

相关文章
|
4月前
|
小程序 JavaScript
【微信小程序】-- WXML 模板语法 - 事件绑定 -- tap & input (十)
【微信小程序】-- WXML 模板语法 - 事件绑定 -- tap & input (十)
|
10月前
|
小程序
【组件】微信小程序input搜索框的实现
【组件】微信小程序input搜索框的实现
214 0
|
28天前
|
小程序 JavaScript 索引
|
28天前
|
小程序 JavaScript 索引
小程序动态添加input及删除
【8月更文挑战第16天】
|
10月前
|
小程序
微信小程序扫描二维码的内容,作为参数跳转填入到下一个页面input框
微信小程序扫描二维码的内容,作为参数跳转填入到下一个页面input框
71 1
|
12月前
|
iOS开发
解决IOS端微信浏览器input,textarea有内上边框阴影
解决IOS端微信浏览器input,textarea有内上边框阴影
60 0
|
小程序 JavaScript
微信小程序系列——如何获取input和textarea的内容
微信小程序系列——如何获取input和textarea的内容
|
13天前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
36 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
13天前
|
小程序 前端开发 JavaScript
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
【避坑宝】是一款企业黑红名单吐槽小程序,旨在帮助打工人群体辨别企业优劣。该平台采用SpringBoot+MybatisPlus+uniapp+uview2等技术栈构建,具备丰富的注释与简洁的代码结构,非常适合实战练习与学习。通过小程序搜索“避坑宝”即可体验。
34 0
【项目实战】SpringBoot+uniapp+uview2打造一个企业黑红名单吐槽小程序
|
30天前
|
存储 小程序 JavaScript