Question

我有一个来自Graph的一部分的Javascript对象，在某些行上可能没有所有数据细节

所以当我把它放在HTML

上时

{{ip.Out.StockItem[0].Out.Properties.Name}}

VueJS在控制台

上出现此错误

无法获得财产＆＃39;姓名＆＃39;未定义或空引用＆＃34;

并且在Properties为空时不呈现页面。

我试过

{{ip.Out.ItemEstoque[0].Out.Properties?.Nome}}

但是没有错误，也没有呈现页面。

数据来自WebAPI，我无法强制执行所有对象都会填写所有数据。

如何解决这个问题？

Answer 1

使用ternary if语句。

以下代码检查override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { if (indexPath.item % 9 == 0) { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: adCellId, for: indexPath) as! AdCell let adSize = GADAdSizeFromCGSize(CGSize(width: self.view.frame.width, height: adViewHeight)) let bannerView = GADBannerView(adSize: adSize) bannerView.adUnitID = "ca-app-pub-3940256099942544/2934735716" bannerView.delegate = self bannerView.rootViewController = self bannerView.translatesAutoresizingMaskIntoConstraints = false let request = GADRequest() bannerView.load(request) cell.contentView.addSubview(bannerView) return cell } else { // ... } }是否存在，如果为ip.Out.StockItem[0].Out.Properties则为true，则不显示任何内容。

Name

另外，您也可以使用模板

{{ip.Out.StockItem[0].Out.Properties ? ip.Out.StockItem[0].Out.Properties.Name : ''}}

Answer 2

如果对象中任何级别的任何属性都可以为null或未定义，则最无错误的方法是

    {{
        ip &&
        ip.Out && 
        ip.Out.StockItem &&
        ip.Out.StockItem[0] &&
        ip.Out.StockItem[0].Out &&
        ip.Out.StockItem[0].Out.Properties &&
        ip.Out.StockItem[0].Out.Properties.Name
        ?
        ip.Out.StockItem[0].Out.Properties.Name
        :
        ""
    }}

但显然这太冗长了。像https://github.com/erictrinh/safe-access这样的图书馆可以让您的生活更轻松

如何在VueJS中处理（或忽略）null属性？

2 个答案: