Question

我是Reactjs的新手。我有角度背景。我面临着手动更改字段纬度的问题。我尝试将onChange与handleChange-一起使用，但它不起作用我在做什么错了？

代码

   class Form extends React.Component {
    constructor(props){
        super(props);
    }
    handleChange(value) {
        let coords= {...this.state.coords}
        coords.latitude = value;
        this.setState({coords})

    }


    render() {
        return (<div>
                    <label htmlFor ="latitude">Широта</label>
                    <input id='latitude' type='text'
                           onChange={(event) => this.handleChange(event.target.value)} value={this.props.coords.latitude} />
                    <label htmlFor ="longitude">Долгота</label>
                    <input id='longitude'  onChange={(type) => {
                               this.setState({type});
                    }}  type='text' value={this.props.coords.longitude}  />
                    <input onClick={this.handleClick} type='submit' value='Посмотреть на карте'/>
                </div>
        );
    }
}

function mapStateToProps(state) {
    return {
        coords: state.coords
    }
}


export default connect(mapStateToProps)(Form);

Answer 1

您正在将mapStateToProps连接器提供的道具与组件的内部state混合。

如果要更改商店中的纬度，则需要dispatch一个进行更改的事件，然后组件将自动更改其值。

您还需要实现mapDispatchToProps。

请参见official guide，其中提到了如何正确实施此操作。

如果我使用mapStateToProps，则输入属性不会更改

1 个答案: