我是新来的反应本地人。在创建应用程序时，我遇到了“null 不是对象”的错误。我已经在整个互联网上进行了研究，但还没有找到解决方案。
我正在使用expo和watermelondb。
错误
TypeError: null is not an object (evaluating 'DatabaseBridge[methodName]')
应用程序.js
import { AppRegistry } from "react-native";
import { name as appName } from "./app.json";
import { Database } from "@nozbe/watermelondb";
import SQLiteAdapter from "@nozbe/watermelondb/adapters/sqlite";
import { mySchema } from "./app/models/schema";
import { dbModels } from "./app/models/index.js";
// Added new import
import { createNavigation } from "./app/screens/Navigation";
// First, create the adapter to the underlying database:
const adapter = new SQLiteAdapter({
dbName: "StudentTable",
schema: mySchema
});
// Then, make a Watermelon database from it!
const database = new Database({
adapter,
modelClasses: dbModels
});
const Navigation = createNavigation({ database });
AppRegistry.registerComponent(appName, () => Navigation);
导航
import React from "react";
import { createStackNavigator, createAppContainer } from "react-navigation";
import 'react-native-gesture-handler';
import Root from "./Root";
import Student from "./Student";
import Tution from "./Tution";
export const createNavigation = props =>
createAppContainer(
createStackNavigator(
{
Root: {
// We have to use a little wrapper because React Navigation doesn't pass simple props (and withObservables needs that)
screen: ({ navigation }) => {
const { database } = props;
return <Root database={database} navigation={navigation} />;
},
navigationOptions: { title: "Students" }
},
Student: {
screen: ({ navigation }) => (
<Student
student={navigation.state.params.student}
navigation={navigation}
/>
),
navigationOptions: ({ navigation }) => ({
StudentName: navigation.state.params.student.StudentName
})
},
NewStudent: {
screen: ({ navigation }) => {
const { database } = props;
return <Tution database={database} navigation={navigation} />;
},
navigationOptions: { title: "New Student" }
},
EditStudent: {
screen: ({ navigation }) => {
return (
<MovieForm
student={navigation.state.params.student}
navigation={navigation}
/>
);
},
navigationOptions: ({ navigation }) => ({
title: `Edit "${navigation.state.params.student.StudentName}"`
})
}
},
{
initialRouteName: "Root",
initialRouteParams: props
}
)
);
我怀疑 Tution.js 的文件
import React, { Component } from "react";
import {
View,
Button,
Container,
Content,
Form,
Item,
Input,
Label,
Textarea,
Picker,
Body,
Text,
DatePicker
} from "native-base";
import {RadioButton} from "react-native-paper"
import { studentStd } from "../models/randomData";
import { date } from "@nozbe/watermelondb/decorators";
class Tution extends Component {
constructor(props) {
super(props);
this.state={
toggle:true,
}
if (props.student) {
this.state = { ...props.student.getStudent() };
} else {
this.state = {};
}
}
render() {
const [checked,setChecked]=React.useState('Bank')
return (
<Container>
<Content>
<Form>
<Item floatingLabel>
<Label>StudentName</Label>
<Input
onChangeText={StudentName => this.setState({ StudentName })}
value={this.state.StudentName}
/>
</Item>
<View style={{ paddingLeft: 15 }}>
<Item picker>
<Picker
mode="dropdown"
style={{ width: undefined, paddingLeft: 15 }}
placeholder="Std"
placeholderStyle={{ color: "#bfc6ea" }}
placeholderIconColor="#007aff"
selectedValue={this.state.Std}
onValueChange={Std => this.setState({ Std })}
>
{studentStd.map((Std, i) => (
<Picker.Item key={i} label={Std} value={Std} />
))}
</Picker>
</Item>
</View>
<View style={{ paddingLeft: 15, marginTop: 15 }}>
<Text style={{ color: "gray" }}>Date</Text>
<DatePicker
locale={"en"}
animationType={"fade"}
androidMode={"default"}
placeHolderText="Date"
defaultDate={new Date()}
onDateChange={FeesDate => this.setState({ FeesDate })}
/>
<Text>
{this.state.date &&
this.state.date.toString().substr(4, 12)}
</Text>
<Text style={{ color: "gray", marginTop: 15 }}>Bank/Cash</Text>
<Textarea
rowSpan={5}
bordered
placeholder="Bank/Cash"
onChangeText={bankorcash => this.setState({ bankorcash })}
value={this.state.bankorcash}
/>
<Text style={{ color: "gray", marginTop: 15 }}>Rtgs No</Text>
<Textarea
rowSpan={5}
bordered
placeholder="rtgsno"
onChangeText={rtgsno => this.setState({ rtgsno })}
value={this.state.rtgsno}
/>
<Text style={{ color: "gray", marginTop: 15 }}>Received Amt</Text>
<Textarea
rowSpan={5}
bordered
placeholder="Received Amt"
onChangeText={recd => this.setState({ recd })}
value={this.state.recd}
/>
<Text style={{ color: "gray", marginTop: 15 }}>Pending</Text>
<Textarea
rowSpan={5}
bordered
placeholder="Pending"
onChangeText={pending => this.setState({ pending })}
value={this.state.pending}
/>
<Text style={{ color: "gray", marginTop: 15 }}>Days Attended</Text>
<Textarea
rowSpan={5}
bordered
placeholder="Days"
onChangeText={daysattended => this.setState({ daysattended })}
value={this.state.daysattended}
/>
</View>
<Body>
<Button onPress={this.handleSubmit}>
<Text>{this.props.student ? "Update " : "Add "} Movie</Text>
</Button>
</Body>
</Form>
</Content>
</Container>
);
}
handleSubmit = () => {
if (this.props.student) {
this.handleUpdateStudent();
} else {
this.handleAddNewStudent();
}
};
handleAddNewStudent = async () => {
const { database } = this.props;
const students = database.collections.get("students");
const newStudent = await movies.create(student => {
student.StudentName=this.state.StudentName,
student.Std=this.state.Std,
student.bankorcash=this.state.bankorcash,
student.rtgsno=this.state.rtgsno,
student.recd=this.state.recd,
student.pending=this.state.pending,
student.daysattended=this.state.daysattended,
student.date=this.state.date
});
this.props.navigation.goBack();
};
handleUpdateStudent = async () => {
const { student } = this.props;
await student.updateStudent({
StudentName:this.state.StudentName,
Std:this.state.Std,
bankorcash:this.state.bankorcash,
rtgsno:this.state.rtgsno,
recd:this.state.recd,
pending:this.state.pending,
daysattended:this.state.daysattended,
date:this.state.date
});
this.props.navigation.goBack();
};
}
export default Tution;
导航.js：
从“反应”导入反应；从“react-navigation”导入 { createStackNavigator, createAppContainer }；
import Root from "./Root";
import Student from "./Student";
import Tution from "./Tution";
export const createNavigation = props =>
createAppContainer(
createStackNavigator(
{
Root: {
// We have to use a little wrapper because React Navigation doesn't pass simple props (and withObservables needs that)
screen: ({ navigation }) => {
const { database } = props;
return <Root database={database} navigation={navigation} />;
},
navigationOptions: { title: "Students" }
},
Student: {
screen: ({ navigation }) => (
<Student
student={navigation.state.params.student}
navigation={navigation}
/>
),
navigationOptions: ({ navigation }) => ({
StudentName: navigation.state.params.student.StudentName
})
},
NewStudent: {
screen: ({ navigation }) => {
const { database } = props;
return <Tution database={database} navigation={navigation} />;
},
navigationOptions: { title: "New Student" }
},
EditStudent: {
screen: ({ navigation }) => {
return (
<StudentForm
student={navigation.state.params.student}
navigation={navigation}
/>
);
},
navigationOptions: ({ navigation }) => ({
title: `Edit "${navigation.state.params.student.StudentName}"`
})
}
},
{
initialRouteName: "Root",
initialRouteParams: props
}
)
);