小程序js文件改变参数并在视图上及时更新

小程序js文件改变参数并在视图上及时更新的开发步骤：

一、简单参数

XX.wxml

1. <view>
2. <text>{{str}}</text>
3. </view>
4. <button bindtap="change">改变</button>
5. XX.js
6.  
7. Page({
8. data: {
9. str:'早上好'
10. },
11. change: function() {
12. this.setData({
13. str:"晚上好"
14. })
15. }
16. })

二、已知下标的数组

XX.wxml

1. <view>
2. <text>{{array[0].text}}</text>
3. </view>
4. <button bindtap="change">改变</button>
5. XX.js
6.  
7. Page({
8. data: {
9. array: [{text: '早上好'}],
10. },
11. change: function() {
12. this.setData({
13. 'array[0].text':'晚上好'
14. })
15. }
16. })

三、动态下标的数组

XX.wxml

1. <view>
2. <block wx:for="array" wx:key="index">
3. <text>{{item.text}}</text>
4. <button bindtap="change" data-index="index">改变</button>
5. </block>
6. </view>
7. <button bindtap="change">改变</button>

XX.js

1. Page({
2. data:{
3. array:[
4. {text:'1111'},
5. {text:'2222'},
6. {text:'3333'}
7. ]
8. },
9. change:function(e){
10. let param = {};
11. let string = "array["+e.target.dataset.index+"].text;
12. param[string] = '0000';
13. this.setData(param);
14. }
15. })

希望对大家有所帮助哦