Wechat アプレット、コンポーネントの追加と削除

Wechat アプレット、コンポーネントの追加と削除

this.data.obj.splice(x,1); を使用すると、配列の値は削除されますが、ページは有効になりません。ページを更新するには this.setData() を使用する必要があります。

以下に 2 つの方法を示します。
1. temp を使用して値をブリッジし、ページを有効にするために値を再割り当てします
。 2. 直接設定します。

js

Page({
    
    
  data: {
    
    
    obj:[],
    obj1:['1111111','222222','333333']
},
/***增加组件 */
onTapAdd:function(e){
    
    
  var temp=this.data.obj;
  var temp1=this.data.obj1;
  temp.push(temp1[temp.length]);
  this.setData({
    
    
    obj:temp
  })
},
/***** 可以修改删除指定组件*/
onTapDel:function(e){
    
    

 //重点在这，必须搭桥，要定义一个新变量temp
  var temp = this.data.obj;
  //this.data.obj.splice(x,1);该做法虽然数组去掉了，但是页面是不会生效的
  temp.splice(temp.length,1);
  //重设即可生效
  this.setData({
    
    
    obj: temp
  })
  /**
  或者直接setData
  this.setData({
    obj: this.data.obj.splice(this.data.obj.length,1)
  })
  */
},
})

wxml

<!--example/deleteComponent/deleteComponent.wxml-->
<view>
   <button bindtap='onTapAdd'>添加input组件</button>
   <button bindtap='onTapDel'>删除Input组件</button>
   <view>
      <block wx:for="{
    
    {obj}}" wx:key="*this" >
          <text>{
    
    {
    
    item}}</text>
      </block>
    </view>
</view>