如何修復@typescript-eslint/no-misused-promises 錯誤

Question

我有一個用於 PrimaryButton class 的 onClick() 方法。我從 eslint 檢查中得到了 @typescript-eslint/no-misused-promises 錯誤。 代碼如下：

onClick = { () =>
    Utils.getName(a, b).then(
        (name) => {
            Utils.deleteThing(name, x, y);
        })
    }

我應該如何修復我的代碼以避免此錯誤？ 感謝您的幫助。 謝謝！

更新：eslint配置如下

錯誤信息在 onClick() 行：

Answer 1

該錯誤指出預期返回無效。 但是，您返回的是 promise。

onClick = { () =>
    Utils.getName(a, b).then(
        (name) => {
            Utils.deleteThing(name, x, y);
        })
    }

你寫箭頭 function 的方式，你返回下面的代碼（一個承諾）而不是運行它並且什么都不返回：

Utils.getName(a, b).then(
            (name) => {
                Utils.deleteThing(name, x, y);
            })

但是，如果您這樣編寫代碼，則會返回 void 並實際運行代碼：

onClick = { () => {
    Utils.getName(a, b).then(
        (name) => {
            Utils.deleteThing(name, x, y);
        })
    }
}

關鍵是箭頭 function 是如何工作的。 如果您在=>之后省略了{ } ，則返回隱含為=>之后的單個語句，這不是您想要的。 您不想返回Utils.getName function，您只是想讓它運行。 有關更多信息，請參見此處。