Add forwardRef hook #177
Comments
|
Are you sure? Don't you want https://github.com/fable-compiler/fable-react/blob/master/src/Fable.React.Hooks.fs#L43 in your case? |
|
Based on the doc section I linked to, then yes, I'm pretty sure I need |
|
My bad, you are correct. This works for me in the repl F#: open Fable.Core.JsInterop
open Fable.React
open Fable.React.Props
open Browser.Types
open Fable.Core
[<Global("React.forwardRef")>]
let forwardRef<'Props,'Ref> (render:('Props -> 'Ref -> ReactElement)) : ReactElementType = jsNative
// import "forwardRef" "react"
let EmailComponent =
forwardRef<_, _> (fun _ ref ->
input [Ref ref]
)
let App =
FunctionComponent.Of(
fun () ->
let emailRef = Hooks.useRef(JS.undefined<HTMLInputElement>)
let onClick _ =
emailRef.current.focus()
div [] [
ReactBindings.React.createElement(EmailComponent, {| ref = emailRef |}, [])
button [OnClick onClick] [str "Click me to focus email"]
]
, "App"
)
mountById "app" (App())html: <!doctype html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="__HOST__/libs/react.production.min.js"></script>
<script src="__HOST__/libs/react-dom.production.min.js"></script>
</head>
<body>
<div id="app"></div>
</body>
</html>So in your code you probably want something like: let forwardRef<'Props,'Ref> (render:('Props -> 'Ref -> ReactElement)) : ReactElementType = import "forwardRef" "react"@vbfox any thoughts on this? |
|
I added it, fa43005 ( I had the same problem with MUI, you need fwRef for HoCs ) I guess the nuget package wasn't released yet, but it's merged. |
|
Great! Any chance to get this deployed? I see it's been quite a while since it was comitted. |
|
Ups, seems I merged that right after coming back from holidays and forgot to release a new version, sorry! I'll do it right away 🚀 |
# for free
to join this conversation on GitHub.
Already have an account?
# to comment
Material-UI often requires
forwardRefif composing using functional components. I couldn't find theforwardRefhook in Fable.React. Would be great to have it!The text was updated successfully, but these errors were encountered: