微信小程序setData的使用

1、设置数据 

可以设置一个或同时多个data数据  

this.setData({

    test:'hello world!',

    info:'data',

})

console.log(this.data.test)   //  结果 =》 “hello world!”
console.log(this.data.info)   //  结果 =》“data”

2、用setData() 设置/修改 对象或数组 里某个属性的值

比如修改 下面 medias 对象里 id的值

①key必须带引号

page({

    data:{

            medias:{id:"666",name:"test"},

     },

    changeData :function(){

        this.setData({

            "medias.id":"999”   //key必须带引号

        })

        console.log(this.data.medias.id)  //  结果 =》 “999”
    }

})

 

②先将 key值用变量保存 ,key值使用时 用[ ]引起来

page({   

    data:{  

        medias:{id:"666", name:"test"}    

     },    

    changeData :function(){     

          var media=“medias.id” ;     //先将 key值用变量保存

          this.setData({       

                 [media]:“999”           // key值使用时 用[ ]引起来

           })    

           console.log(this.data.medias.id)   //  结果 =》 “999” 

    }

})

3⃣️ 动态index  修改data

Page({

    data: {

        dataList: [{

            subTitle: "【冰鲜】马鲛鱼",

            details: "500g~600g/条 1000g130元",

            count: 2,

        },

        {           

            subTitle: "【冰鲜】秋刀鱼",     

          details: "400g~500g/条 1000g80元", 

            count: 3,     

     }]

 }, 

bindReduce(e) {

        var index = e.target.dataset.index;   

              //点击事件从 wxml 获取自定义属性index 用于判断是修改数组中第几个元素的数量

        var count = 'dataList[' + index + '].count'    

         this.setData({

                [count]: this.data.dataList[index].count -1

         })

    }

});

四 不同input 绑定同一个事件 通过 传type 做不同的状态更新

<view class="container">

        <view>
             <label>姓名</label>

            <input bindinput='changeValue' value="{{name}}" data-type="name"></input>

        </view>

    <view>

        <label>手机号</label>

          <input type="number" bindinput='changeValue' value="{{phone}}" data-type="phone">       </input>

    </view>

</view>

changeValue(e){ 

         var value = e.detail.value;
         var type = e.currentTarget.dataset.type;
         this.setData({
                 [type]: value
         })

        console.log('name',this.data.name)
        console.log('phone', this.data.phone)
 }

 

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值