如何使用createRef()将渲染道具内部的子对象的ref转发到容器组件?

时间:2018-07-25 22:16:18

标签: javascript reactjs

我有一个private static final String MY_HTML_FILE = "my-html-file.html"; public static void main(String[] args) { HtmlToPojoEngine htmlToPojoEngine = HtmlToPojoEngine.create(); HtmlAdapter<Restaurant> adapter = htmlToPojoEngine.adapter(Restaurant.class); // If they were several restaurants in the same page, // you would need to create a parent POJO containing // a list of Restaurants as shown with the meals here Restaurant restaurant = adapter.fromHtml(getHtmlBody()); // That's it, do some magic now! } private static String getHtmlBody() throws IOException { byte[] encoded = Files.readAllBytes(Paths.get(MY_HTML_FILE)); return new String(encoded, Charset.forName("UTF-8")); } 组件,可以在渲染道具中渲染一堆元素。在渲染道具内部,我想将一堆元素的CreatRef()引用传递回其父级<Controller />

<Controller />

因此,refs应该在Controller内部可以访问。如何实现呢?

2 个答案:

答案 0 :(得分:0)

在进行渲染的类中创建ref对象。像往常一样,使用ref =将它们传递到它们所附加的组件。然后将它们传递给控制器​​,而不使用参考名称。

答案 1 :(得分:0)

在React中使用ref道具时,它始终分配给您将其附加到的组件,例如,如果您将createRef()附加到控制器上的ref道具上,则为参考集将成为控制器组件。

如果您想将createRef()更深地传递到组件中,则需要使用其他prop名称,例如innerRef之后,您可以使用innerRef组件将ref道具分配给子元素,例如ref={props.innerRef}

此外,您可以使用React.forwardRef()函数组件来允许您仍然使用ref,但可以控制将其分配给哪个子元素。

  

https://reactjs.org/docs/forwarding-refs.html