Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

Cannot update a child component on his parent

$
0
0

Well, I'm pretty new with React Native and I'm trying to update a child component on his Parent, the thing is that I'm giving this error (Warning: Cannot update a component from inside the function body of a different component.) and I don't know what to do.

https://imgur.com/a/1LhMsfY -> The father component.

const CallList: React.FC<NavigationProps> = (props) => {  const [absences, setAbsences] = useState<Array<Array<{    id: number,    checked: boolean  }>>>([]);  // const [absences, setAbsences] = useState([{'id': 0, 'checked': false},{'id': 1, 'checked': false}]);  const { setOptions } = useNavigation();  const {aula} = props.route.params;  const [students, setStudents] = useState<Array<StudentProps>>([]);  const [loading, setLoading] = useState<boolean>(false);  const {signOut, docente, anoSemMat} = useAuth();

https://imgur.com/a/FMe98UQ -> That's the place where I call the Child Component (StudentsList)

if (loading || absences.length == 0 || students.length == 0) return <Loading/>;  else {    return (<><ScrollView style={styles.scrollView} contentContainerStyle={{ flexGrow: 1, marginTop: 30}}><SafeAreaView><TouchableWithoutFeedback onPress={Keyboard.dismiss}><KeyboardAvoidingView behavior = "position"><View style={styles.container}>                        {students.map((student, idx) => {                            return <StudentsList                                      key={student.NRO_ALUNO}                                      student={student}                                      value={absences[idx]}                                      onChange={(classes, nroAluno) => setAbsences(changeAbsenceStudent(classes, nroAluno))}                                      // onChange={(classes, nroAluno) => setAbsences(classes)}                                    />                        })}<Button onPress={() => console.log(absences)} title="click"/></View></KeyboardAvoidingView></TouchableWithoutFeedback></SafeAreaView></ScrollView></>    );  }

https://imgur.com/a/mZFKLiB -> The Child Component

interface Students {    student: StudentsListProps;    onChange: (classes: Array<{      id: number,      checked: boolean    }>, pos: number) => void;    value: Array<{      id: number,      checked: boolean    }>}interface StudentsState {    isVisible: boolean,    checkAll: boolean,    classes: Array<{        id: number,        checked: boolean    }>,    student: StudentsListProps}export default class StudentsList extends React.Component<Students, StudentsState> {  constructor(props : Students) {    super(props)    const { student, value } = this.props;    this.state = {      isVisible: false,      checkAll: false,      classes: value,      student: student    }  }

All I need is to get the value from StudentsList on CallList but I don't know the best way to do that so I made this "onChange" in StudentsList.


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>