Question

我正在使用react-native-maps并试图绘制多条折线。我已将状态中的此结构中的点分组：

var groups = [{
    Key: 'YELLOW',
    Points: [],
}]

现在，我想将Lat / lng对象推送到Points数组中，但是它给对象带来了不可扩展的错误。我尝试使用[... this.state.groups]扩展服装，但无法在其中添加积分。

我有一个单独的数组，其中包含具有所有点数据的相似结构。这里的概念是，我需要将每个点都有延迟的数据推送到该组数据结构中，以便折线/路径绘制缓慢。

Answer 1

假设您具有以下结构

const groups = [{Key: 'YELLOW',Points: [],},{Key: 'BLUE',Points: [],}]

您想将一对lat/lng推入每个Points中，可以这样做

const pushPoint = point =>{
    const updatedGroups = group.map(group =>({
        ...group,
        Points : group.Points.concat(point)
    }))

    return updatedGroups
}

this.setState({groups : this.pushPoint(this.state.groups)})

您需要spread原始组，并通过返回一个新数组覆盖Points属性，该新数组是前一个Points和新{{1 }}

Answer 2

让他去见我们

 const totsl= [{key: 'YELLOW',Points: [],},{Key: 'BLUE',Points: [30,40],}],

要使用此.state.groups，您应该

state={groups = [{
    Key: 'YELLOW',
    Points: [],
}};

totsl.Points.map(item=>
this.setState({this.state.groups.Points:item})
to add in the state Points it should b use this syntax this.state({groups :{points:value"}}

，

告诉我它是否有效还是有问题

Answer 3

我以这种方式使用了splice和concat函数：

添加

this.setState((state) => {

    var newArray = [...state.cordinates, {
        latitude: point.latitude,
        longitude: point.longitude,
    }];

    return {
        cordinates: newArray,
    };

});

要删除：

this.setState((state) => {

    var newArray = [...this.state.cordinates];

    newArray.splice(-1, 1);

    return {
        cordinates: newArray,
    };

});

反应状态中的更新阵列

3 个答案: