时间戳

首页 > 解决方案 > 我可以将类基础组件放在函数基础组件中以使用反应挂钩吗？

reactjs - 我可以将类基础组件放在函数基础组件中以使用反应挂钩吗？

问题描述

我有一个主要使用类基础反应组件编写的应用程序，但是我们正在使用 Stripe 实现付费专区功能。

问题是条带使用钩子，它不适用于类基础组件。是否可以将子类基础组件放入父函数基础组件中以实现此目的。如果不将每个组件都重写为函数基础组件，我将如何做到这一点。

每次尝试包含具有类基子级的函数基组件总是会产生此错误：

错误：无效的挂钩调用。钩子只能在函数组件的主体内部调用。

是否有任何解决方法，或者我应该将所有组件重新编写为功能组件？

一个使用 react-router-dom 查询参数的快速示例，然后将它们传递到类基子组件中。

 function useQuery() {
   return new URLSearchParams(useLocation().search);
 }

const App = () => {
let query = useQuery();

return (
  <Provider store={store}>
    <Router>
      <div className="App">
        <Navbar />
        <Switch>
          {/* Public Pages */}
          <Route exact path="/" component={Landing} ref={query.get('ref')} /> 
       </Switch>
      </div>
    </Router>
  </Provider>
)
}
 export default App;

然后假设登陆组件是一个简单的类基础组件，它将设置道具进入状态。

标签： reactjsreact-reduxreact-routerreact-hooksstripe-payments

解决方案

组件的类型与父子关系无关。但是你不能在 classBased 组件中使用钩子。仅在功能性

推荐阅读