javascript - React Hooks 可以有方法吗？

Question

如何编写 React Hooks 函数来导出 export default 中的方法？

我没有在任何地方看到示例，所以我怀疑 React Hooks 不是这样工作的，但是......我很好奇是否可以扩展 hook 函数以导出子方法。

---

Checkout.js:

import React from "react";

function Checkout() {
  return <section className="checkout"></section>;
}

// Add Item Method
Checkout.addItemPrice = (item, price) => {
  console.log("this is a method");
};

export default Checkout;

Checkout.test.js:

import React from "react";
import ReactDOM from "react-dom";
import Checkout from "./Checkout";

describe("Checkout Test Suite", () => {
    it("Can add an item", () => {
        var checkout = new Checkout();
        checkout.addItemPrice('a', 1);
    });
});

---

类型错误:checkout.addItemPrice 不是函数

我一直没能找到在 Hooks 中编写它的方法，但在一天结束时，我最终将它们分成 2 个函数，2 个导出和 2 个导入。

Answer 1

与钩子(Hook)无关。如果您希望您的 new Checkout() 实例有一个 addItemPrice 方法，那么您应该将它添加到原型(prototype)中:

Checkout.prototype.addItemPrice = (item, price) => {