Skip to content
This repository was archived by the owner on May 29, 2022. It is now read-only.
This repository was archived by the owner on May 29, 2022. It is now read-only.

Warning: Stateless function components cannot be given refs. Attempts to access this ref will fail. #55

@annelorraineuy

Description

@annelorraineuy

Using the textfield from this package causes a React warning when adding a Textfield Input.

Warning: Stateless function components cannot be given refs. Attempts to access this ref will fail.

Check the render method of `NativeDOMAdapter`.
    in TextInput (created by NativeDOMAdapter)
    in NativeDOMAdapter (created by Meta)
    in Meta (created by Input)
    in Input (at AddAccount.js:528)
    in div (created by NativeDOMAdapter)
    in NativeDOMAdapter (created by Meta)
    in Meta (created by Textfield)
    in Textfield (at AddAccount.js:527)

Example implementation that brings up the warning:

<Textfield>
              <Textfield.Input
                id="username"
                onChange={this.onChange}
                value={this.props.username}
                required
              />
              <Textfield.Label htmlFor="username">
                {localize('username')}
              </Textfield.Label>
 </Textfield>

It looks like the code above generates the TextInput with a ref. See screenshot below:
screen shot 2017-08-23 at 9 33 59 am


"react": "16.0.0-beta.3"
"@react-mdc/textfield": "^0.1.10"

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions