哎~
不知不覺自己已經自學微信小程式已經半年了，想起了自己之前剛剛學小程式的時候場景，艱辛~。。。

所以的話，現在一直有個關於setData()的苦惱，但是今天似乎已經解決了。

說下我今天遇到的問題吧！先看面的程式碼

data: {
    index: [{
        color: 'rgb(255,246,143)',
        name: '紙張'
      },
      {
        color: 'rgb(0,255,0)',
        name: '書籍'
      },
      {
        color: 'rgb(203,186,252)',
        name: '報刊'
      }
    ]
}


onShow:function(){
   var that = this;
   var color1 = this.data.index[0].color;
   var color2 = this.data.index[1].color;
   var color3 = this.data.index[2].color;
    //顏色變換
    var randomOne_01 = Math.round(Math.random() * 1000 / 3.92);
    var randomOne_02 = Math.round(Math.random() * 1000 / 3.92);
    var randomOne_03 = Math.round(Math.random() * 1000 / 3.92);
    var randomTwo_01 = Math.round(Math.random() * 1000 / 3.92);
    var randomTwo_02 = Math.round(Math.random() * 1000 / 3.92);
    var randomTwo_03 = Math.round(Math.random() * 1000 / 3.92);
    var randomThree_01 = Math.round(Math.random() * 1000 / 3.92);
    var randomThree_02 = Math.round(Math.random() * 1000 / 3.92);
    var randomThree_03 = Math.round(Math.random() * 1000 / 3.92);
    this.setData({
      color1 : 'rgb(' + randomOne_01 + ',' + randomOne_02 + ',' + randomOne_03 + ')',
      color2 : 'rgb(' + randomTwo_01 + ',' + randomTwo_02 + ',' + randomTwo_03 + ')',
      color3 : 'rgb(' + randomThree_01 + ',' + randomThree_02 + ',' + randomThree_03 + ')',
    }, () => {
       console.log('成功');
    })
}
 

以上就是我的錯誤程式碼~
沒有當Show的時候並沒有改變那個color
很奇怪~又沒有報錯！！！

先看下文件吧~
官方文件

Page.prototype.setData(Object data, Function callback)
setData 函式用於將資料從邏輯層傳送到檢視層（非同步），同時改變對應的 this.data 的值（同步）

Object 以 key: value 的形式表示，將 this.data 中的 key 對應的值改變成 value

注意：

1. 直接修改 this.data 而不呼叫 this.setData 是無法改變頁面的狀態的，還會造成資料不一致。
2. 僅支援設定可 JSON 化的資料。
3. 單次設定的資料不能超過1024kB，請儘量避免一次設定過多的資料。
4. 請不要把 data 中任何一項的 value 設為 undefined ，否則這一項將不被設定並可能遺留一些潛在問題。

Page 例項的生命週期：

最重要的即將到來：

// index.js
Page({
  data: {
    text: 'init data',
    num: 0,
    array: [{text: 'init data'}],
    object: {
      text: 'init data'
    }
  },
  changeText() {
    // this.data.text = 'changed data' // 不要直接修改 this.data
    // 應該使用 setData
    this.setData({
      text: 'changed data'
    })
  },
  changeNum() {
    // 或者，可以修改 this.data 之後馬上用 setData 設定一下修改了的欄位
    this.data.num = 1
    this.setData({
      num: this.data.num
    })
  },
  changeItemInArray() {
    // 對於物件或陣列欄位，可以直接修改一個其下的子欄位，這樣做通常比修改整個物件或陣列更好
    this.setData({
      'array[0].text': 'changed data'
    })
  },
  changeItemInObject() {
    this.setData({
      'object.text': 'changed data'
    })
  },
  addNewField() {
    this.setData({
      'newField.text': 'new data'
    })
  }
})
 

上面介紹了，關於text、num、array、object四種類型的setData()操作
很清楚我的程式碼錯了

修改之後我的程式碼：

data: {
    index: [{
        color: 'rgb(255,246,143)',
        name: '紙張'
      },
      {
        color: 'rgb(0,255,0)',
        name: '書籍'
      },
      {
        color: 'rgb(203,186,252)',
        name: '報刊'
      }
    ]
}


onShow:function(){
   var that = this;
    //顏色變換
    var randomOne_01 = Math.round(Math.random() * 1000 / 3.92);
    var randomOne_02 = Math.round(Math.random() * 1000 / 3.92);
    var randomOne_03 = Math.round(Math.random() * 1000 / 3.92);
    var randomTwo_01 = Math.round(Math.random() * 1000 / 3.92);
    var randomTwo_02 = Math.round(Math.random() * 1000 / 3.92);
    var randomTwo_03 = Math.round(Math.random() * 1000 / 3.92);
    var randomThree_01 = Math.round(Math.random() * 1000 / 3.92);
    var randomThree_02 = Math.round(Math.random() * 1000 / 3.92);
    var randomThree_03 = Math.round(Math.random() * 1000 / 3.92);
    this.setData({
      'index[0].color' : 'rgb(' + randomOne_01 + ',' + randomOne_02 + ',' + randomOne_03 + ')',
      'index[0].color' : 'rgb(' + randomTwo_01 + ',' + randomTwo_02 + ',' + randomTwo_03 + ')',
      'index[0].color' : 'rgb(' + randomThree_01 + ',' + randomThree_02 + ',' + randomThree_03 + ')',
    }, () => {
       console.log('成功');
    })
}

ok!!!
color成功修改~~~
所以說呢~看文件好過百度