微信小程序setData 赋值对象属性

这几天在做页面的时候，关于setData方法产生了一点疑问，现在来总结一下。

首先说一下赋值对象属性的两种方法

1.修改data下的对象

this.setData({'params.name':'李四'
})

2.修改data下的对象数组

this.setData({'example[1].text':"清零"
})

如果要给对象数组中某一个对象的某个属性赋值，可以采用以下两种方式：

var temp1 = 'example['+order+'].state'
var temp2 = `example[${order}].text`

然后通过[temp1]:'runnning'这样的方式来进行赋值

下面是代码示例

wxml

<view class="container1"><viwe>{{params.name}}</viwe><button type="primary" bindtap="changetext1"> 点击我改变文字</button>
</view><view class="container2"><view class="container-content" wx:for="{{example}}"><view>{{item.state}}</view><view>{{item.text}}</view><button type="primary" bindtap="changetext2" data-index="{{index}}"> 点击我改变文字</button></view>
</view>

data: {params: {name: '张三',age: '18',gender: 1},example: [{id: '1',state:"paused",text:"第一个"},{id: '2',state:"running",text:"第二个"}]},changetext1:function(){console.log(1)this.setData({'params.name':'李四'})},changetext2:function(e){var order = e.target.dataset.indexconsole.log(e.target.dataset.index)var temp1 = 'example['+order+'].state'var temp2 = `example[${order}].text`this.setData({[temp1]:'down',[temp2]:'清零'})},

效果图

original：

after bindtap：

微信小程序setData 赋值对象属性相关推荐

微信小程序.setData 设置对象属性值，不改变对象整体属性
.setData 设置对象属性值步骤一:data初始化数据 userInfo: { nickName:'昵称', avatarUrl:'https://c-ssl.duitang.com/tx.pn ...
微信小程序--监听对象属性变化
本以为小程序会跟vue差不多有像watch一类的方法,好吧并没有.百度了很多,看了很多大神写的案例.奈何天资不太行,虽然效果有了,但还是不太懂. app.js //监听属性值函数watch:funct ...
微信小程序————setData()方法的使用和注意事项
微信小程序setData()使用: ##Page.prototype.setData(Object data, Function callback) setData 函数用于将数据从逻辑层发送到视图层 ...
小程序setdata优化_微信小程序 setData的使用方法详解
微信小程序 setData的使用方法详解微信小程序 setData的使用方法详解最近在使用微信小程序的setData时,遇到了以下问题.如下: 官网文档在使用setData()设置数组对象的某个元 ...
微信小程序，实现 watch 属性，监听数据变化
转自微信小程序,实现 watch 属性,监听数据变化目标在微信小程序实现 watch 属性,监听 data 中的属性,当被监听属性的值改变时,执行我们指定的方法. 思路 Vue 的 compu ...
微信小程序setdata方法
微信小程序setdata方法微信小程序中有时候需要从其他位置获取数据在前端调用一般会用到小程序中封装好的setdata方法: /** `setData` 函数用于将数据从逻辑层发送到视图层*(异步 ...
微信小程序view标签hover-class属性和text标签selectable和decode属性
微信小程序view标签hover-class属性和text标签selectable和decode属性 <view hover-class="hc">按下样式</v ...
微信小程序，购买商品属性自动换行，固定div个数，超出部分自动换行
微信小程序,购买商品属性自动换行,固定div个数,超出部分自动换行参考**指定每行div个数(三个为例)** <view class="spec"><view ...
微信小程序循环赋值坑（转）
原文:https://blog.csdn.net/d7185540/article/details/71438328 最近在弄微信小程序,类似于共享单车用来练练手,基本原理就是小程序发送经纬度给服务器 ...

微信小程序setData 赋值对象属性

微信小程序setData 赋值对象属性相关推荐

最新文章

热门文章