question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

"getWrappedInstance is not a function"

See original GitHub issue

Greetings,

I want to use Ref on my connect components. A search through google finds everyone suggesting to pass {withRef: true} as the 4th argument to connect() and then use ref. getWrappedInstance() to access the wrapped instance of the component.

However, when I try it I’m getting “getWrappedInstance is not a function”. I read through the docs, is getRef only available in advancedConnect() now?

I attempted to use advancedConnect but the documentation for selectorFactory is difficult to understand and I couldn’t make the change from connect to advancedConnect.

Here is my code snippet:

export default connect(mapStateToProps, mapDispatchToProps, null, { withRef: true })(Element);

and ref.getWrappedInstance() simple gives me “getWrappedInstance is not a function”.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:1
  • Comments:6 (1 by maintainers)

github_iconTop GitHub Comments

7reactions
Venryxcommented, Mar 4, 2019

Nevermind, I don’t know how I missed it, but it’s just been replaced by the forwardRef option seen here (which removes the need for getWrappedInstance): https://react-redux.js.org/api/connect#forwardref-boolean

2reactions
timdorrcommented, Oct 19, 2018

getWrappedInstance is a function on the element itself. You can use it like our tests do.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to access child component functions via refs
I am attempting to use this in my application but run into an "undefined is not a function" error when the child function...
Read more >
How to access a redux component's methods with createRef()
The getWrappedInstance function gives the Child component access to the Parent's refs, check out this Codepen example to see the code in ...
Read more >
connectAdvanced | React Redux
Connects a React component to a Redux store. It is the base for connect() but is less opinionated about how to combine state...
Read more >
[Solved]-What is the proper interface for element with ...
Here is a small utility type to add the missing definition. // connect.ts type WrappedConnectedComponent<T> = { getWrappedInstance(): T } export function ......
Read more >
Advanced React/Redux Techniques | How to Use Refs on ...
No… Not those kinds of refs. ... Then, you can use the getWrappedInstance() method to… you guessed it… get the wrapped instance.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found