React Native: The specified child already has a parent

Viewed 6447

I have 2 components, DraggableCard and ChooseMachine (ChooseMachine uses a DraggableCard). When I reach the ChooseMachine component it returns me with the error: The specified child already has a parent. You must call removeView() on the child's parent first.

I don't have a clue on what child component is that's being called twice.

I've tried to remove the Some Text that's being passed as a prop to DraggableCard, which resolves the error, but DraggableCard doesn't show and that's not exacly what I need. It should display the DraggableCard and the text passed. I've already tried to put Some Text around the tag but the problem remains the same.

import React, {Component} from 'react'
import {View} from 'react-native'
import MapView from 'react-native-maps'

import styles from './style'
import DraggableCard from '../../components/DraggableCard'

export default class ChooseMachine extends Component{

  render(){
    return(
      <View style={styles.body}>
        <MapView
          style={styles.map}>

          <DraggableCard>
            Some Text
          </DraggableCard>

        </MapView>

      </View>
    )
  }
}

DraggableCard component

import React, {Component} from 'react'
import { View, Text } from 'react-native'

export default class DraggableCard extends Component {

  render(){

    return(
      <View
        style={styles.containerStyle}>
        <View style={styles.smallHyphen}/>
        <Text>
          {this.props.children}
        </Text>
      </View>
    )
  }
}

I expect to render the DraggableCard on the ChooseMachine component

1 Answers
Related