Sunday, 11 June 2023

What does react docs mean by "... pass this.props.onChange directly to Chosen ..." in the article "Integrating with jQuery Chosen Plugin"?

I am going through the react documentation article of integrating-with-jquery-chosen-plugin, and there they mention:

We won’t pass this.props.onChange directly to Chosen because component’s props might change over time, and that includes event handlers. Instead, we will declare a handleChange() method that calls this.props.onChange, and subscribe it to the jQuery change event

This doesn't make sense to me, because they are already using(passing as prop?) onChange on Chosen in <Chosen onChange={value => console.log(value)}>. Here's the code the docs use just after:

function Example() {
  return (
    <Chosen onChange={value => console.log(value)}>
      <option>vanilla</option>
      <option>chocolate</option>
      <option>strawberry</option>
    </Chosen>
  );
}

It appears to me that the docs wanted to say:

We won’t pass this.props.onChange directly to Chosen select because [Chosen]component’s props might change over time, and that includes event handlers(onChange?).

But still I don't grasp the meaning of props including event listeners might change. The only prop that might change here is the children prop, which would affect select's {this.props.children}. Why would the onChange event listener change?

Can someone please elaborate upon what the docs are trying to say.



from What does react docs mean by "... pass this.props.onChange directly to Chosen ..." in the article "Integrating with jQuery Chosen Plugin"?

No comments:

Post a Comment