错误是:不变量违规:组件'div'的view config getter回调必须是一个函数(接收到'undefined')。确保组件名称以大写字母开头。我在尝试从firebase检索数据到react native的表组件时遇到此错误,该组件是ReactTable,并且在控制台中查看数据时在控制台中给出空数组,因此输出中没有显示任何内容。
import React, { Component } from 'react';
import { StyleSheet, View, Text, Button } from 'react-native';
import ReactTable from 'react-table';
import firebase from 'firebase';
const firebaseConfig = {
...
};
firebase.initializeApp(firebaseConfig);
export default class Form1 extends Component {
constructor(props) {
super(props);
this.state = {
data: [],
columns: [
{
Header: "email",
accessor: "email"
},
{
Header: "password",
accessor: "password"
}
]
}
}
componentDidMount() {
const data = [];
var query = firebase.database().ref("users");
query.once("value").then((snapshot) => {
snapshot.forEach((childSnapshot, index) => {
let singleObj = {
email: childSnapshot.val().email,
password: childSnapshot.val().password,
}
data.push(singleObj);
if (index === snapshot.length - 1) {
this.setState({ data: data });
}
});
});
}
render() {
return (
<div>
{this.state.data.length > 0 && <ReactTable data={this.state.data} columns=
{this.state.columns} />}
</div>
);
}
}
const styles = StyleSheet.create({
container: { flex: 1, padding: 16, paddingTop: 30, backgroundColor: '#fff' },
head: { height: 40, backgroundColor: '#f1f8ff' },
text: { margin: 6 }
});
8条答案
按热度按时间xnifntxz1#
有时,当组件的导入不正确时会发生此错误。在我的react-native项目中,FlatList是从react-native-web而不是react-native framework导入的,这导致了上述错误。当我从react-native framework导入时,它工作正常。
4ioopgfo2#
你不能在react native中使用div,用View更改它
变化
到
希望这有帮助!
bnlyeluc3#
我得到了一个类似的错误,它说
错误是:不变量违规:组件“form”的视图配置getter回调必须是一个函数(接收到“未定义”)。
我的问题是,我使用的是一个Web版本,使用从formik,所以我只需要使用React Native之一,这是改变形式到视图。
希望它能帮助其他人。
yjghlzjz4#
如果从react-native-web而不是react-native导入“TouchableOpacity”,则从错误的组件模块导入组件时会发生错误
6g8kf2rb5#
我有问题,它得到了修复,只是改变了目的地,从我进口
我不得不导入TouchableOpacity。在VSCode中,代码片段选择了错误的库,因此它被插入为这样
而不是
在正确的导入中更改它帮助我解决了这个问题。
只是回答让你知道这也是一种固定。
ssgvzors6#
我经常遇到这种情况。每当我声明TouchableOpacity或其他组件时,vscode都会自动从'react-native-web'导入组件。但是我们应该从'react-native'导入它所以确保我们从**'react-native'导入它**
hof1towb7#
我刚刚在另一个模块中体验到了这一点:React-Insta-Stories。在花了大约一个小时的故障排除后,我现在发现该模块从未用于React Native。所以,如果您遇到这种类型的错误,请检查以确认该模块旨在在React Native中工作,而不仅仅是react。
slwdgvem8#
有时您定义的View必须大写。