Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >小程序中监听textarea或者input输入的值动态改变data中数组的对象的值

小程序中监听textarea或者input输入的值动态改变data中数组的对象的值

作者头像
用户4792944
修改于 2019-04-22 04:35:52
修改于 2019-04-22 04:35:52
5.8K00
代码可运行
举报
文章被收录于专栏:小程序栏小程序栏
运行总次数:0
代码可运行
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
Page({
  data: {
    todoLists:[
      {
        detail:"",
        date:"",
        location:"",
        priority:"",
        remark:"",
        dateStatus:false,
        locationStatus:false,
        dateRepeat:false,
        completeStatus: false,
        currentInput:"",
      },
      {
        detail: "",
        date: "",
        location: "",
        priority: "",
        remark: "",
        dateStatus: false,
        locationStatus: false,
        dateRepeat: false,
        completeStatus: false,
        currentInput:"",
      }
    ],
  },
  getInput:function(e){
    let index = e.currentTarget.dataset.index;
    let currentInput = `todoLists[${index}].currentInput`;
    this.data.todoLists[index].currentInput = e.detail.value;
    this.setData({
      todoLists: this.data.todoLists
    })
    console.log(this.data.todoLists[index].currentInput) // 可以实时改变
  }
})
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<textarea class="weui-textarea {{ item.completeStatus && item.completeStatus === true ? 'text-transparent' : '' }}" placeholder="请输入文本" bindinput="getInput" maxlength="1000" data-index="{{index}}" value="{{item.currentInput}}" auto-height auto-focus="true" />

小程序中监听textarea或者input输入的值动态改变data中数组的对象的值,不能通过setData设置数组对应索引的对象的值来改变,改变之后,能检测到改变,但是值为空。先通过赋值改变其中数组中的对象的值,然后重新设置数组。

参考链接:https://blog.csdn.net/chou_out_man/article/details/75575100

https://cloud.tencent.com/developer/article/1186246

本文系转载,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文系转载,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
暂无评论
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验