From fa5e6e7a988b4cb465601e4c3beece321edeb812 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Thu, 2 Apr 2020 00:35:24 +0100 Subject: [PATCH] Remove misleading example in Forms (#2875) * Remove misleading example in Forms * Update forms.md * Update forms.md --- content/docs/forms.md | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/content/docs/forms.md b/content/docs/forms.md index 65b6e6d3..5b4c87d8 100644 --- a/content/docs/forms.md +++ b/content/docs/forms.md @@ -68,13 +68,7 @@ class NameForm extends React.Component { Since the `value` attribute is set on our form element, the displayed value will always be `this.state.value`, making the React state the source of truth. Since `handleChange` runs on every keystroke to update the React state, the displayed value will update as the user types. -With a controlled component, every state mutation will have an associated handler function. This makes it straightforward to modify or validate user input. For example, if we wanted to enforce that names are written with all uppercase letters, we could write `handleChange` as: - -```javascript{2} -handleChange(event) { - this.setState({value: event.target.value.toUpperCase()}); -} -``` +With a controlled component, the input's value is always driven by the React state. While this means you have to type a bit more code, you can now pass the value to other UI elements too, or reset it from other event handlers. ## The textarea Tag {#the-textarea-tag}