I choose a bug report for this but I guess this will be more a discussion-like thing.
When working with @microsoft/fast-react-wrapper (version 1.0.0-alpha.27) I run into two problems which I think originate from the same "culprit":
First one is using refs with wrapped elements and second one is calling public methods of the original FASTElement using a ref.
So in general when you want to use the ref prop on a wrapped FASTElement you need to do it like this:
const myRef = React.createRef<Component<typeof MyFASTElement>>();
function onClick() {
myRef.current.myMethod(); //<-- will not work since the member is not included in the type definition
}
<MyFASTElement ref={myRef} onClick={onClick} />
Problem is that this hides the fact that ref contains an instance of MyFASTElement and thus you cannot access any public members.
I am not yet 100% familiar with this issue but I belive what is missing is a proper union type for the ReactWrapper<TElement> type definition. Something like this:
I choose a bug report for this but I guess this will be more a discussion-like thing.
When working with
@microsoft/fast-react-wrapper
(version1.0.0-alpha.27
) I run into two problems which I think originate from the same "culprit":First one is using refs with wrapped elements and second one is calling public methods of the original FASTElement using a ref.
So in general when you want to use the
ref
prop on a wrappedFASTElement
you need to do it like this:Problem is that this hides the fact that ref contains an instance of
MyFASTElement
and thus you cannot access any public members.I am not yet 100% familiar with this issue but I belive what is missing is a proper union type for the
ReactWrapper<TElement>
type definition. Something like this:Important is the
& TElement & Component
part. This way you can build refs like this and have thecurrent
value be an instance of the actual element:Any thoughts on this? I am still playing around with it but so far it looks promising...