undefined | Better HN

poxrud8y ago· 5 in thread

For those that are confused, updating the property would mean:

  this.input.value = 'password';

This would be fine. However updating the attribute (the way React recommends it with controlled components) would be something like:

  <input type="text" value={this.state.value} onChange={this.handleChange} />

This would be vulnerable to the the CSS keylogger.

dimgl8y ago

That being said, you might be thinking about this incorrectly if you're doing this.

You can use a form and grab the values on submission.

    <form onSubmit={this.handleSubmission}>
      <input type="password" name="password" />
    </form>

    this.handleSubmission = event => {
      // access to event.target.password.value
    }

baddox8y ago

You still lose things like validation on blur and displaying real-time password strength.

always_good8y ago

It might be a fair workaround, but it sucks to regress to storing truth in the DOM.

Cyranix8y ago

I believe using `defaultValue` instead of `value` would be an appropriate remediation.

elliotec8y ago

Do you mind expanding on this a little? Or linking to a documentation or something

1 more reply

humblebee8y ago

It updates the attribute, you can see this pretty easily by going to the Instagram website. If you inspect the password field in the browser, when you type in a value you can see it reflected on the `value` attribute of the input element.

vog8y ago

But that requires extra work, compared to simple JSX-based React code, doesn't it?

0 comments

0 comments