Question

我收到错误消息”，当您尝试将键latitude设置为不可变且已冻结的对象时，您试图将其值xx.xxxxx设置为export default class Map extends Component{ constructor(){ super(); this.state = { region: { latitude: 37.78825, longitude: -122.4324, latitudeDelta: 0.0922, longitudeDelta: 0.0421 }, radius: 500 } } componentWillMount(){ } regionChange = (region) =>{ let reg = this.state.region; reg.latitude = region.latitude; reg.longitude = region.longitude; this.setState({region:reg}); } changeRadius = (radius) => { this.setState({radius}); console.log("RADIUS", this.state.radius); } render(){ return ( <View style={ styles.map }> <MapView provider={PROVIDER_GOOGLE} style={ styles.map } region={this.state.region} onRegionChangeComplete={(region) => {this.regionChange(region)}} onPress={(event) => this.regionChange(event.nativeEvent.coordinate)} > <MapView.Circle center = { this.state.region } radius = { this.state.radius } strokeWidth = { 1 } strokeColor = { '#1a66ff' } fillColor = { 'rgba(230, 238, 255, 0.5)' } onRegionChangeComplete = {(region) => {this.regionChange({region});console.log(region)}} /> <Marker coordinate = { this.state.region } title = {"Marker"} description = {"Marker description"} /> </MapView> <Slider step={50} maximumValue={2000} onValueChange={(value) => this.changeRadius(value)} value={this.state.radius} style={{marginTop:10}} /> <Autocomplete regionChange={(reg) => this.regionChange(reg)} /> </View> ) } } 应用程序启动或当我尝试通过回调函数更改区域的坐标时。

我的目标是能够从输入字段（如Google Maps）上更改区域位置。但是每当我更改坐标时，都会出现此错误。我尝试过使用新坐标重新渲染地图，这种方法行之有效，但这会产生很多要求。

是否可以在不重新渲染整个地图的情况下为该区域提供新坐标并显示它？

这是我的代码：

    // Move to the next page or to the last one
    $endpos = $_SESSION['tmpval']['pos']
        + $_SESSION['tmpval']['max_rows'];

    if ($this->__get('unlim_num_rows') === false // view with unknown number of rows
        || ($endpos < $this->__get('unlim_num_rows')
        && $this->__get('num_rows') >= $_SESSION['tmpval']['max_rows']
        && $_SESSION['tmpval']['max_rows'] != self::ALL_ROWS)
    ) {

        $table_navigation_html
            .= $this->_getMoveForwardButtonsForTableNavigation(
                $html_sql_query, $pos_next, $is_innodb
            );

    } // end move toward

Answer 1

对象不是原始数据类型。因此，它们通过引用按值传递。在执行let reg = this.state.region的代码中，已引用了this.state.region。因此，当您更改reg时，您将直接更改状态，这在反应上是一个大问题。

我建议您使用传播运算符创建新的状态副本。 let reg = { ...state, {} }

更改react-native地图上区域的坐标时出错

1 个答案: