Prefer destructuring es-lint错误

Question

我有这个功能：

const calculateTotal = (items) => {
  return items.reduce((totalPrice, basketItem) => {
    const price = basketItem.product.price;
    const quantity = basketItem.quantity;
    const total = price * quantity;
    return totalPrice + total;
  }, 0);
};

如何使用 ES6+ 解构修复此问题？

我知道我需要类似的东西（第 4 行）：

const { basketItem: quantity } = quantity;

但我无法让第 3 行正常工作

Answer 1

const quantity=basketItem.quantity;

下面这个解构方法：

const {quantity}=basketItem;

Answer 2

根据您尝试执行的操作，您可以执行此操作以从 product 获取 price 并从 basketItem 获取 quantity，而无需在两个单独的变量上声明变量行。

const calculateTotal = (items) => {
  return items.reduce((totalPrice, basketItem) => {
    const { product: { price }, quantity } = basketItem;

    const total = price * quantity;
    return totalPrice + total;
  }, 0);
};

Prefer destructuring es-lint错误

Prefer destructuring es-lint error

javascript

destructuring

reactjs

eslint