I'm encountering issues with adding objects to the list. I have a list of floors, each floor containing rooms. I can successfully add a floor, but I'm unsure how to add rooms to the floor list.
I've attempted to access floor[index] or id, but it doesn't seem to be working. What steps should I take next?
export default class HomeWork extends Component {
constructor() {
super();
this.state = {
floors: [
{
floorId: 1, name: 'floor1', rooms: [
{ roomId: 1, name: 'new room' },
{ roomId: 2, name: 'new room' }]
},
{
floorId: 2, name: 'floor2', rooms: [
{ roomId: 1, name: 'new room' },]
}
]
}
}
addRoom(index) {
const RoomArr = [...this.state.floors[index].rooms]
RoomArr.push(
{ id: 2, roomName: 'New Room' });
this.setState({
// Currently stuck at this point
})
}
render() {
return (
<View style={styles.parent}>
<View >
<FlatList
data={(this.state.floors)}
renderItem={({ item }) => {
return (
<View>
<View >
<Text>Floor {item.floorNumber}</Text>
<Text>Room per Floor:</Text>
<Text >{item.rooms.length}</Text>
<TouchableOpacity onPress={(index) => { this.addRoom(index) }}>
<Image source={Images.plusIcon}></Image>
</TouchableOpacity>
</View>
<FlatList
data={(item.rooms)}
numColumns={4}
renderItem={({ item }) => {
return (
<View>
<Text>{item.roomName}</Text>
</View>
)
}}
></FlatList>
</View>
)
}}
></FlatList>
</View>
</View>
)
}
}
My hope is to at least be able to retrieve the index of the floor.