按月過濾一系列產品

我在 vue 中做一個專案，我有一個陣列里面有陣列的 json。我想對月份進行過濾，以便我選擇的月份顯示具有該過濾器的產品串列

而且我有幾個月（6、12、18）的選擇器，如何只顯示我用選擇器選擇的產品？

 [
      {
        "active": true,
        "installment": [
          [
            {
              "product": "Ipad",
              "months": 12,
              "installment": 63.94
            }
          ],
          [
            {
              "product": "Ipad",
              "months": 6,
              "installment": 63.94
            }
          ]
        ]
      },
      {
        "active": true,
        "installment": [
          [
            {
              "product": "Iphone",
              "months": 12,
              "installment": 63.94
            }
          ],
          [
            {
              "product": "Iphone",
              "months": 6,
              "installment": 63.94
            }
          ]
        ]
      },
      {
        "active": true,
        "installment": [
          [
            {
              "product": "Mac",
              "months": 18,
              "installment": 63.94
            }
          ],
          [
            {
              "product": "Mac",
              "months": 24,
              "installment": 63.94
            }
          ]
        ]
      }
    ]

uj5u.com熱心網友回復：

您可以遍歷陣列，然后將傳遞條件的元素推送到新陣列，它看起來像這樣

const array = [
    {
        "active": true,
        "installment": [
            [
                {
                    "product": "Ipad",
                    "months": 12,
                    "installment": 63.94
                }
            ],
            [
                {
                    "product": "Ipad",
                    "months": 6,
                    "installment": 63.94
                }
            ]
        ]
    },
    {
        "active": true,
        "installment": [
            [
                {
                    "product": "Iphone",
                    "months": 12,
                    "installment": 63.94
                }
            ],
            [
                {
                    "product": "Iphone",
                    "months": 6,
                    "installment": 63.94
                }
            ]
        ]
    },
    {
        "active": true,
        "installment": [
            [
                {
                    "product": "Mac",
                    "months": 18,
                    "installment": 63.94
                }
            ],
            [
                {
                    "product": "Mac",
                    "months": 24,
                    "installment": 63.94
                }
            ]
        ]
    }
]

let res = [];
// const filter = (y) => y.months == 6;
// if you have multiple filters
const filter = (y) => [6, 12, 18].includes(y.months);
array.forEach(x => {
    x.installment.forEach(y => {
        y[0].active = x.active;
        if (filter(y[0])) res = [...res, ...y];
    })
})

console.log(res);

uj5u.com熱心網友回復：

你可以過濾它們

const data = [
  {
    "active": true,
    "installment": [
      [
        {
          "product": "Ipad",
          "months": 12,
          "installment": 63.94
        }
      ],
      [
        {
          "product": "Ipad",
          "months": 6,
          "installment": 63.94
        }
      ]
    ]
  },
  {
    "active": true,
    "installment": [
      [
        {
          "product": "Iphone",
          "months": 12,
          "installment": 63.94
        }
      ],
      [
        {
          "product": "Iphone",
          "months": 6,
          "installment": 63.94
        }
      ]
    ]
  },
  {
    "active": true,
    "installment": [
      [
        {
          "product": "Mac",
          "months": 18,
          "installment": 63.94
        }
      ],
      [
        {
          "product": "Mac",
          "months": 24,
          "installment": 63.94
        }
      ]
    ]
  }
]

const filtered = data.map((item) => {
  const { installment } = item;
  const filteredInstallment = installment.map((item) => {
    const filteredProducts = item.filter((product) => product.months === 6)
    return filteredProducts;
  });

  return filteredInstallment;
});

console.log(filtered)

標籤：javascript json

上一篇：如何在Python中查詢復雜的嵌套JSON資料

下一篇：在JS腳本中推送PHP陣列