setData 函式用於將資料從邏輯層傳送到檢視層（非同步）,同時改變對應的 this.data 的值（同步）.setData中可以傳入的引數Object 以 key: value 的形式表示,將 this.data 中的 key 對應的值改變成 value。其中 key 可以以資料路徑的形式給出，支援改變陣列中的某一項或物件的某個屬性,有時我們需要在使用變量表示key,這時應該如何操作呢.

問題描述:

例一:

  binddata: function (e) {
        var idNum = e.target.id;
        this.setData({ idNum: e.detail.value });
    }
 

idNum傳過去，直接是data中多了一個’idNum’的資料，不是動態的id數值.

例二:

   changeIntro:function (event) {
        let videoArrayIndex = event.target.dataset.index;
        this.setData({
            'videoArray[videoArrayIndex].introState' : true
        })
    }

無法改變introState的值,因為videoArrayIndex沒有被解析為序列號.

解決辦法:

一. 用一個空物件暫存

var data = {}
data[key] = value // key 可以是任何字串
this.setData(data)

使用一箇中間物件暫存解決上述例二

changeIntro:function (event) {
        let videoArrayIndex = event.target.dataset.index;
        let dataIntro = {};
        let keyIntro = 'videoArray['+videoArrayIndex+'].introState';
        dataIntro[keyIntro] = true
 
; // key 可以是任何字串
        this.setData(dataIntro)
    }

二. 使用es6新特性

ES6 允許宣告在物件字面量時使用簡寫語法，來初始化屬性變數和函式的定義方法，並且允許在物件屬性中進行計算操作：

 this.setData({
            [key]: value
        })

使用es6新特性解決上述例二

  changeIntro:function (event) {
        let videoArrayIndex = event.target.dataset.index;
        this.setData({
            ['videoArray['+videoArrayIndex+'].introState'] : true
        })
    }

更為清爽的瀏覽體驗,請移步我的個人部落格
天心天地生的個人部落格

技能樹.IT修真院
“我們相信人人都可以成為一個工程師，現在開始，找個師兄，帶你入門，掌控自己學習的節奏，學習的路上不再迷茫”。
這裡是技能樹.IT修真院，成千上萬的師兄在這裡找到了自己的學習路線，學習透明化，成長可見化，師兄1對1免費指導。快來與我一起學習吧~
憑邀請碼註冊可享受學費減免優惠
我的邀請碼：25344308 ，或者你可以直接點選此連結：
修真院註冊連結