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

現(xiàn)象描述

這是 JS 開(kāi)發(fā)中常見(jiàn)的錯(cuò)誤。對(duì)一個(gè)值為 null 或 undefined 的變量取屬性就會(huì)報(bào)錯(cuò)。例如：

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

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

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

解決方法

1、通過(guò)邏輯運(yùn)算的執(zhí)行順序來(lái)規(guī)避錯(cuò)誤。代碼如下：

app.ux代碼如下：

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

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

推薦方案 2，在 ViewModel 上建立一個(gè) 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>