小程序，修改数组或对象中的值，通过input动态修改数组对象中的值

最新推荐文章于 2024-07-20 15:32:16 发布

原创最新推荐文章于 2024-07-20 15:32:16 发布 · 608 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#小程序

小程序专栏收录该内容

9 篇文章

订阅专栏

本文介绍了如何在JavaScript中通过事件监听实现数据输入时，动态更新数据列表中的元素。通过`changeInp`函数，当input框内容变化时，会选择并修改sourceList对象中指定位置的属性值。实时打印数据变化，便于开发过程中的调试。

data: {
  sourceList: [{
    name: '',
    link: '',
    code: '',
    intactLink: ''
  }, {
    name: '',
    link: '',
    code: '',
    intactLink: ''
  }, {
    name: '',
    link: '',
    code: '',
    intactLink: ''
  }]
}

changeInp(event) {
	let index = event.currentTarget.dataset.index // 循环时获取的改变的index
	let name = event.currentTarget.dataset.name // 循环时获取的改变的元素
	let changeContent = event.detail // input框中改变的值
	let choseKey = `sourceList[${index}].${name}` // 选择数据对象中的键
	this.setData({
	  [choseKey]: changeContent // 更新值
	})
	console.log(this.data.sourceList) // 实时改变
}