AppGallery Connect：快應(yīng)用如何避免讀取undefined變量的屬性導(dǎo)致報錯

現(xiàn)象描述

這是 JS 開發(fā)中常見的錯誤。對一個值為 null 或 undefined 的變量取屬性就會報錯。例如：

<!-- a = {}; --> 

<text>{{ a.b.c }}</text>

<!-- Error: Cannot read property 'c' of undefined -->

解決方法

1、通過邏輯運算的執(zhí)行順序來規(guī)避錯誤。代碼如下：

app.ux代碼如下：

<text>{{ a && a.b && a.b.c }}</text>

2、 在 ViewModel 上增加函數(shù)方法

推薦方案 2，在 ViewModel 上建立一個 checkEmpty 函數(shù)。示例代碼如下：

export default {

  checkEmpty(...args) {

    let ret

    if (args.length > 0) {

      ret = args.shift()

      let tmp

      while (ret && args.length > 0) {

        tmp = args.shift()

        ret = ret[tmp]

      }

    }

    return ret || false

  }

}

這樣，就可以方便的調(diào)用了。

<text>{{checkEmpty(a, 'b', 'c')}}</text>