反应受控组件实现的差异

时间:2018-07-17 08:24:01

标签: javascript reactjs ecmascript-6

我有一个具有道具input的{​​{1}} TextField组件。每次我重新使用此组件时,都会将状态值设置为emty字符串或状态中已经存在的某个值。我使用value来避免value={value || ''}null问题。

这两个方法之间有什么区别。

示例1:

组件undefined

TextField

我如何使用

const TextField = ({label, ...props}) =>
    <MuiTextField
        label={label}
        {...props}
    />

仅是同一示例,我在const emptyUser = { lastName: '', firstName: '', } const prepareState = props => ({ user: props.user ? {...props.user} : emptyUser, photoUrl: props.user && props.user.photoUrl, errors: {}, }) export class Parent extends Component { constructor(props) { super(props) this.state = prepareState(props) } render = () => { <TextField name='firstName' label={<FormattedMessage id='firstName.title' />} placeholder={intl.formatMessage({id: 'firstName.example'})} value={this.state.firstName || ''} onChange={({target: {value}}) => this.changeUser({firstName: value})} /> } } 组件中设置了modev值声明

TextField

0 个答案:

没有答案