*



You are watching: Function components cannot be given refs

I am using react-final-form and also jest library.

Why i am still obtaining this warning? Ref is working fine, i am able to clear select value whenever ns switch tabs.I to be trying to move pick component out of the tabs but this warning is still presented.

*

My component looks like:

import React, Component, createRef from 'react'; import select from 'react-select'; import field native 'react-final-form'; import TextField from 'final-form-material-ui'; import withStyles native '
material-ui/core/Paper'; function TabPanel(props) const children, value, index, ...other = props; return ( value === table of contents && children ); class SelectPrimaryContactUser extends component constructor(props) super(props); this.primaryContactSelectRef = createRef(); this.state = activeTab: 0, selectedUser: props.value ? props.users.find(user => user.value === props.value) : null, ; handleChangeUser = alternative => this.setState( selectedUser: option, ); ; handleTabSwitch = (event, newValue) => const handleCreateNewUserFieldsFlag = this.props; if (newValue === 1 && this.primaryContactSelectRef.current) this.primaryContactSelectRef.current.select.clearValue(); if (handleCreateNewUserFieldsFlag) handleCreateNewUserFieldsFlag(newValue === 1); this.setState( activeTab: newValue, ); ; render() const users, showCreateNewUser, classes, firstNameLabel, lastNameLabel, emailLabel, phoneLabel, selectUserPlaceholder = this.props; const selectedUser, activeTab = this.state; return ( showCreateNewUser && ( showCreateNewUser && ( ) ) (
input.onChange(option !== null ? option.value : null); this.handleChangeUser(option); onBlur=event => input.onBlur(event) styles= control: provided => ( meta.submitError) && meta.touched ? '#f44336' : provided.borderColor, ), />


See more: How To Block Someone On Offerup, Offerup Has Users Whom You Can'T Block

); } const styles = layout => ( ); export default withStyles(styles)(SelectPrimaryContactUser);