如何访问LoadableComponent和Route中的子项？

Question

在我的主要组件中,我创建了一个ref:

this.transfernewRef = React.createRef();

并将其分配给我的组件,该组件嵌入在路径中:

<Route path="/new" render={(props) => <TransferNew {...props} origin={this.state.origin} token={this.state.token} ref={this.transfernewRef} />}/>

我的组件TransferNew也使用react-loadable及其Loadable组件动态加载.如果我打印this.transfernewRef.current,我会得到一个LoadableComponent对象:

如何从那里访问我的组件TransferNew？我似乎找不到合适的方法来做到这一点.我只想调用TransferNew的一个函数,所以就这样:

this.transfernewRef.current.<something>.myFunction()

谢谢.

Answer 1

我有同样的问题。我的解决方案

import Loadable from "react-loadable";
import { Loading } from "components/Loading";

const Dropzone = Loadable({
  loader: () => import("view/components/knowledge/components/Dropzone.jsx"),
  loading: Loading,
  render(loaded, props) {
    const Component = loaded.default;
    const ref = props.DropzoneRef || undefined;
    return <Component {...props} ref={ref} />;
  },
});