Skip to content

Commit 04ced3b

Browse files
authored
Merge pull request #169 from plotly/component-updates
Update function component
2 parents 81fea22 + 5c71f95 commit 04ced3b

File tree

1 file changed

+14
-12
lines changed

1 file changed

+14
-12
lines changed

{{cookiecutter.project_shortname}}/cookiecutter_templates/FunctionComponent.react.js

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -11,23 +11,25 @@ import PropTypes from 'prop-types';
1111
const {{cookiecutter.component_name}} = (props) => {
1212
const {id, label, setProps, value} = props;
1313

14+
const handleInputChange = (e) => {
15+
/*
16+
* Send the new value to the parent component.
17+
* setProps is a prop that is automatically supplied
18+
* by dash's front-end ("dash-renderer").
19+
* In a Dash app, this will update the component's
20+
* props and send the data back to the Python Dash
21+
* app server if a callback uses the modified prop as
22+
* Input or State.
23+
*/
24+
setProps({ value: e.target.value });
25+
};
26+
1427
return (
1528
<div id={id}>
1629
ExampleComponent: {label}&nbsp;
1730
<input
1831
value={value}
19-
onChange={
20-
/*
21-
* Send the new value to the parent component.
22-
* setProps is a prop that is automatically supplied
23-
* by dash's front-end ("dash-renderer").
24-
* In a Dash app, this will update the component's
25-
* props and send the data back to the Python Dash
26-
* app server if a callback uses the modified prop as
27-
* Input or State.
28-
*/
29-
e => setProps({ value: e.target.value })
30-
}
32+
onChange={handleInputChange}
3133
/>
3234
</div>
3335
);

0 commit comments

Comments
 (0)