Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
// components/common/app_text_field.js
// @flow
import React, { Component } from 'react';
import TextField from 'material-ui/TextField';
class AppTextField extends Component {
constructor(props: any) {
super(props);
this.state = { value: props.value }
}
state: { value: any; }
componentWillUpdate(nextProps: any, nextState: any) {
if (this.props.value !== nextProps.value && nextProps.value !== nextState.value) {
this.setState({ value: nextProps.value });
}
}
onChange(event: any) {
this.setState({
value: event.target.value,
});
if (this.props.onChange) {
this.props.onChange(event);
}
}
props: {
onChange?: Function;
value?: any;
}
render() {
const override = {
value: this.state.value,
onChange: this.onChange.bind(this),
};
return <TextField {...this.props} {...override} />;
}
}
export default AppTextField;
import React, { Component } from 'react';
import AppTextField from 'components/common/app_text_field';
class FooTextField extends Component {
// snip
render() {
return <AppTextField {...this.props} {...override} />;
}
}
export default FooTextField;
import React from 'react';
import { Field } from 'redux-form';
import FooTextField from 'components/foo_text_field';
const renderInput = (field: Object): React.Element<*> => <FooTextField {...field.input} />;
// snip
render () {
return (
<Field
name='foobar'
component={renderInput}
floatingLabelText='foobar'
/>
)
}
@masaya48

This comment has been minimized.

Show comment Hide comment
@masaya48

masaya48 May 26, 2017

現在ランサーズの記事で拝見した現象と同じもので頭を悩ませています。
よろしければ、具体的にどのような変更をして解消したのか教えていただけませんでしょうか。

現在ランサーズの記事で拝見した現象と同じもので頭を悩ませています。
よろしければ、具体的にどのような変更をして解消したのか教えていただけませんでしょうか。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment