时间戳

首页 > 解决方案 > Axios / Json for 循环，如何防止此错误？

vue.js - Axios / Json for 循环，如何防止此错误？

问题描述

我的部分代码是这样的，URL 在 for-loop 下。

    axios.get(Url).then((response) => {
      let getJsonAPI = response.data.data.products;
      if (response.data.data.products.length > 0) {
        state.jsonGetProductsAPI.push(getJsonAPI);
      }
    });

我收到此错误，因为响应不包含 products 属性

只有当“数据”树中有东西时，我才想推送 getJsonAPI。代码按预期工作，但有一个错误，我的强迫症不允许我继续项目:(有什么想法吗？我是新手

在此处输入图像描述

在此处输入图像描述

在此处输入图像描述

标签： vue.jsaxiosvuex

解决方案

您可以只使用可选链接 (?.)语法。它是专门为像您这样的情况设计的，因此您可以替换a && a.b && a.b.c为a?.b?.c：

axios.get(Url).then((response) => {
  const products = response.data.data.products;
  if (products?.length) {
    state.jsonGetProductsAPI.push(products);
  }
});

如果在某些情况下响应不包含data属性，您也应该选择链接它：

const products = response.data.data?.products;

另请注意，您不需要任何 polyfill，Vue 会为您转换（转换为a && a.b && a.b.c语法）。

推荐阅读