-
Notifications
You must be signed in to change notification settings - Fork 26
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
"Using input fields" guide #95
base: master
Are you sure you want to change the base?
Conversation
great stuff 🙌 noticed the 'e' parameter explenation could be an unabbrivated event and proceed to explain that the target is a reference to the element triggering the event |
Really great work! Just gave it a light read through. |
|
||
```html | ||
<div class="input"> | ||
<div class="label">The Lion says</div> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Screenreader friendly version:
<label for="lion">The Lion says</label>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good suggestion! ✨
```html | ||
<div class="input"> | ||
<div class="label">The Lion says</div> | ||
<input type="text" id="lion" oninput=${updateLion} /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Not sure if relevant in this situation; but setting a default value from state
might make sense - that way on re-renders the value isn't cleared. Not sure if it matters too much here tho
<input value=${state.lion} />
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
A default value is set on this element a few paragraphs later. I wanted to make a point to the reader that not setting a value
property might break things, especially if you're re-rendering frequently.
@bendik you're probably right about the
Should I expand on this more? There's a bit of a description about what these event reference objects do in the first guide, |
@louiscenter Good to hear it's explained in the |
This guide will introduce developers to the very basics of wiring up input fields to their application's state. A more advanced guide describing complex form structures will follow, but this tutorial will describe how to create the most basic of interactive forms.