reactjs - React - 不变违规:超过最大更新深度
问题描述
我有从另一个类设置我的状态的功能,但是我收到了以下错误
超过最大更新深度。当组件在 componentWillUpdate 或 componentDidUpdate 中重复调用 setState 时,可能会发生这种情况。React 限制了嵌套更新的数量以防止无限循环。
这是我的代码看起来像
constructor(props) {
super(props)
this.state = { loading: true, showAction: false }
setTimeout(() => {
StatusBar.setBackgroundColor(primary)
}, 100)
}
async componentWillMount() {
await Font.loadAsync({
Roboto: require("native-base/Fonts/Roboto.ttf"),
Roboto_medium: require("native-base/Fonts/Roboto_medium.ttf"),
Ionicons: require("@expo/vector-icons/build/vendor/react-native-vector-icons/Fonts/Ionicons.ttf"),
});
this.setState({ loading: false });
}
setShowAction = (isShowAction) => {
console.log(isShowAction)
this.setState({
showAction: isShowAction
})
}
...
<ChatListScreen onAction={(isShowAction) => this.setShowAction(isShowAction)}/>
...
const ChatListScreen = ({ onAction }) => {
return (
<ChatList onAction={(isShowAction) => onAction(isShowAction)}/>
)
}
...
const ChatList = ({ onAction }) => {
const [selectMode, setSelectMode] = useState(false)
const chatListDummy = []
const [selectedItem, setSelectedItem] = useState([])
{selectMode ? onAction(true) : onAction(false)}
return (
<FlatList
data= {chatListDummy}
keyExtractor= {chat => chat.id}
renderItem= {({item}) => {
}}/>
)
}
export default ChatList
任何人都可以帮忙吗?
解决方案
看我的解决方案
const ChatListScreen = ({ onAction }) => {
return (
<ChatList onAction={(isShowAction) => onAction(isShowAction)}/>
)
}
const ChatList = ({ onAction }) => {
const [selectMode, setSelectMode] = useState(false)
const [selectedItem, setSelectedItem] = useState([])
//i dont know where are you using this actally you most use this in a lifesycle or a function
// {selectMode ? onAction(true) : onAction(false)}
function onClick(){
selectMode ? onAction(true) : onAction(false)
}
//or a lifecycle
useEffect(()=>{
selectMode ? onAction(true) : onAction(false)
},[])
return (<div onClick ={onClick} >{"your content"}</div>)
推荐阅读
- command-line - 命令行查找路径是否匹配并删除所有内容
- reactjs - 无法从“node_modules\react-redux\lib\index.js”解析“./utils/batch”
- python-3.x - 使用来自 TextInput 的名称保存 file.txt
- r - 如何重塑数据框并将重复列转置为数据框行?
- c++ - 将 all_of 与一组 lambda 函数一起使用?
- c# - 文件上传后两次读取数据
- powershell - 如果条件让我发疯
- reactjs - 无法在无状态功能中使用引导反应模式
- java - 如何从/向两个具有不同包名称和不同 Firebase 项目的不同应用发送 FCM 推送通知?甚至可能吗?
- ios - 将 Realm.Configuration 放入 shouldRestoreApplicationState 是否安全?