Question

我正在练习使用axios with Vue，但我认为这可能更像是一个通用的JSON问题。

我已经成功地使用axios来获取本地的product.json文件，然后使用过滤器来创建一个新数组，该数组仅包含具有匹配部门属性的产品，并将其循环出去。

这是执行此操作的正确方法，还是可以在原始axios调用上实际过滤JSON结果？我知道我可以传递一个参数，该参数将依次执行特定的数据库调用，并且仅在第一位置提供所需的JSON。

undefined

谢谢。只是试图澄清其背后的理论。

Answer 1

如果您要从后端服务器查询产品列表，您可以使用

之类的查询参数

xxx/products?department=XXX

然后后端服务器可以为您进行过滤。

在您的情况下，您似乎只是在读取本地JSON文件，因此将返回整个JSON，并且您必须进行过滤。

Answer 2

它可以根据您的情况或要求以多种方式起作用。

您的工作方式。另外，您也可以假设后端返回完整结果，直接从API调用中过滤结果。

data() {
 return {
  filteredProducts: []
 }
}

mounted() {
 axios.get(API_URL)
  .then(response => {
   const products = response.data

   this.filteredProducts = products.filter(product => product.department.includes('food'))
  })
}

使用Vue过滤JSON响应

2 个答案: