当我运行我的代码时,我收到了这个错误。
错误:超过了最大更新深度。当组件重复调用componentWillUpdate或componentDidUpdate内部的setState时,会发生这种情况。React限制嵌套更新的数量,以防止无限循环。这是我的代码
import React, { Component, useState } from 'react';
import {View, StyleSheet,Button,Text, Image,Alert, } from 'react-native';
import { ScrollView, TextInput, ListItem, TouchableOpacity } from 'react-native-gesture-handler';
import firebase from '../database/firebaseDb';
import Index from './list';
import { useNavigation} from '@react-navigation/native';
export default class Profiles extends React.Component{
static navigationOptions = {
title: 'Profile',
headerStyle: {
backgroundColor: '#f4511e',
},
//headerTintColor: '#0ff',
headerTitleStyle: {
fontWeight: 'bold',
},
};
constructor(props){
super();
this.state={
email_user : props.route.params.email_user,
password_user : props.route.params.password_user,
id : '',
name_user: '',
first_name_user: '',
}
}
dataBase(){
var userId = firebase.auth().currentUser.uid;
let shopRef = firebase.database().ref('User/' + userId);
var id = [];
var i =0;
shopRef.on("value",(snapshot) => {
snapshot.forEach((childSnapshot) => {
i = i+1;
id[i] = childSnapshot.val();
});
this.setState({
first_name_user : id[3],
})
// console.log(this.state.first_name_user);
});
}
render(){
return(
<View>
<View >
{/* <Text>Cover photo</Text> */}
<Image
style={styles.coverStyle}
source={require('../images/cover.jpg')}
/>
</View>
<View style={styles.pdpStyle}>
{/* <Text>Photo profile</Text> */}
<Image
style={styles.photoPdpStyle}
source={require('../images/femme.jpeg')}
/>
</View>
<View style={styles.nomStyle}>
<Text style={styles.textStyle}>{this.state.first_name_user}</Text>
</View>
<View style={styles.pubStyle}>
<Button
title={"Add"}
style={styles.btnStyle}
/>
<TextInput
placeholder={'Enter your Ads'}
style={styles.txtInputStyle}
/>
<Image
style={styles.imgStyle}
source={require('../images/photo.png')}
/>
</View>
<View style={styles.pubAdd}>
<View style={styles.AlignPubStyle}>
<Image
style={styles.pubImg}
source={require('../images/femme.jpeg')}
/>
<Text style={styles.nameTxtStyle}>
Your name
</Text>
</View>
<Text >
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,
when an unknown printer took a galley of type and scrambled it to make a type
specimen book. It has survived not only five centuries, but also the leap into
electronic typesetting, remaining essentially unchanged. Ipsum passages, and more
</Text>
<View style={styles.AlignPubCommentStyle}>
<Image
style={styles.likeImg}
source={require('../images/like.png')}
/>
<TextInput
style={styles.txtInputComment}
placeholder={'Your comment'}
/>
<View >
<TouchableOpacity style={styles.appButtonContainer} onPress={
this.dataBase()
}>
<Text style={styles.appButtonText}>
Send
</Text>
</TouchableOpacity>
</View>
</View>
</View>
</View>
);
}
}
我是用react native编写代码的初学者。我只想得到first_name_user的值,但当我通过this.state调用这个值时。first_name_user,然后出现错误。我已经看到了同一个问题的所有答案,但他们无法解决我的问题。你能帮我吗。
我不是100%确定就是这样,但这是一个可能的解释,在您的数据库函数中,您创建了一个侦听器(on("value",…)
)。
因此,单击几次之后,您就有大量侦听器触发setState,这可能是因为渲染太多了。
你可以试试这样的方法:
dataBase(){
var userId = firebase.auth().currentUser.uid;
let shopRef = firebase.database().ref('User/' + userId);
var id = [];
var i =0;
const updateCallback = ()=> new Promise((resolve) => {
(snapshot) => {
snapshot.forEach((childSnapshot) => {
i = i+1;
id[i] = childSnapshot.val();
});
this.setState({
first_name_user : id[3],
}, resolve())
}
})
shopRef.on("value", updateCallback);
updateCallback().then(() =>{
shopRef.off("value", updateCallback);
})
}
如果有帮助,请告诉我,检查实施情况,但你明白了。
问题内容: 我试图在ReactJS中切换组件的状态,但出现错误: 超过最大更新深度。当组件重复调用componentWillUpdate或componentDidUpdate内部的setState时,可能会发生这种情况。React限制了嵌套更新的数量,以防止无限循环。 我在代码中看不到无限循环,有人可以帮忙吗? ReactJS组件代码: 问题答案: 那是因为您在render方法中调用了toggle
我在代码中没有看到无限循环,有人能帮忙吗? ReactJS组件代码:
我在React中运行我的应用程序时收到一个错误。这个错误有很多问题,但我不知道如何解决它。当我按下链接时,它会指向登录组件。“http://localhost:3000/login” 这是我在网站上得到的错误: “已超出最大更新深度。当组件重复调用组件内部的 setState 时,可能会发生这种情况“组件将更新”或“组件更新”。React 限制了嵌套更新的数量,以防止无限循环。 这是我的登录页面:
我正在用React做我的前几个实验,在这个组件中,我调用了一个外部API来获取所有NBA玩家的列表,通过作为组件道具接收的teamId过滤它们,最后呈现过滤玩家的标记。 一个需要考虑的问题是,由于我调用了API并获得了一个大列表,所以我将它保持在组件的状态,以便对该组件的新调用将使用该状态,而不是再次调用API。这不是生产代码,我没有API,所以我这样做是因为我收到了“太多请求”消息,因为我一直在
使用React 16.8,我已经用useReucer、useContext钩子实现了我的项目,并创建了一个类似于Redux的全局状态管理系统。 在视图中,当我试图在useEffect中获取数据时,它会导致最大更新深度错误。 我已经尝试了Facebook React-Hooks常见问题解答中的所有示例,但无法解决问题。 我的package.json是这样的: 下面是我的代码示例: 这里是风景。js
我目前收到Maxiumum更新深度错误,不知道为什么。在我的代码中看不到无限循环。 "超过了最大更新深度。当组件在useEffect内部调用setState时,可能会发生这种情况,但useEffect要么没有依赖关系数组,要么其中一个依赖关系在每次渲染时都会发生变化。 此处显示错误 ReactJS组件代码: 下面的代码似乎有错误:超过了最大更新深度。当组件在useEffect中调用setState