CODEWITHSUNDEEP
reactjsredux
Benjamin Li
Benjamin Li

Reputation: 1697

react with redux, event handler name

I am looking at this source code. 

render() {
    const { value, onChange, options } = this.props

    return (
      <span>
        <h1>{value}</h1>
        <select onChange={e => onChange(e.target.value)}
                value={value}>
          {options.map(option =>
            <option value={option} key={option}>
              {option}
            </option>)
          }
        </select>
      </span>
    )
  }

my question is, why the event handler is onChange? I think the standard html attribute is onchange. and unfortunately, I cannot find any react document about the event handler names

thanks

Upvotes: 0

Views: 253

Answers (2)

David L. Walsh
David L. Walsh

Reputation: 24815

Firstly, HTML attributes are case insensitive, so onchange, onChange and ONCHANGE are all equivalent in HTML.

However, JSX is not HTML. In React, case is important, so onChange it must be.

The select element in React also differs in other ways from the select element in HTML. For instance, value is defined on the select element, making the selected attribute on the option element obsolete.

Upvotes: 1

Dez
Dez

Reputation: 5838

Event is defined as onChange in ReactJS: https://facebook.github.io/react/docs/events.html

You have some examples of use in ReactJS documentation website: https://facebook.github.io/react/docs/forms.html

Upvotes: 0

Related Questions