我正在尝试创建一个简单的待办事项列表应用程序。一切都在网络上运行,但在 Android 上我收到标题中写的错误。
当我注释掉 CheckBox 内的 value 和 onValueChange 时,没有任何问题,但包含该代码会导致崩溃。
我查找了其他地方提到的一些问题,例如空白和条件渲染,但据我所知,这些问题都不适用。
这是我的代码:
import { StyleSheet, View, TextInput } from 'react-native';
import { useState } from 'react';
import CheckBox from 'expo-checkbox';
const Task = props => {
let data = props.data;
//console.log(data.created, data.done, data.text, data.focus);
const [valueDisplayed, onChangeText] = useState(data.text);
return (
<View style={styles.task}>
<CheckBox
value={data.done}
onValueChange={(value)=>{props.finish(data.created)}}
/>
<TextInput
value={valueDisplayed}
onChangeText={input => {
onChangeText(input);
props.update(data.created, input);
}}
style={styles.textBox}
onKeyPress={keyPress => {
console.log(keyPress.nativeEvent.key);
if (keyPress.nativeEvent.key == "Enter") {
props.add(data.created);
} else if (data.text.length == 0 &&
keyPress.nativeEvent.key == "Backspace") {
props.delete(data.created);
}
}}
onSubmitEditing={() => {
props.add(data.created);
}}
autoFocus={data.focus}
/>
</View>
);
}
const styles = StyleSheet.create({
task: {
flexDirection: "row",
},
textBox: {
flex: 1,
fontSize: 32,
}
});
export default Task;
感谢您的帮助:)
...根据要求,这是父组件的摘录:
const finishItem = async (list, created, setTasks) => {
let array = await loadList(list);
for (let i = 0; i < array.length; i++)
if (array[i].created == created)
if (array[i].done == 0)
array[i].done = Date.now();
else
array[i].done = 0;
sortTasks(array);
setTasks(array);
await saveList(list, array);
}
const TaskList = (props) => {
const [tasks, setTasks] = useState([]);
useEffect(()=>{
getInitialList(props.list, setTasks);
}, []);
return (
<FlatList
data={tasks}
extraData={tasks}
renderItem={({item}) => (
<Task
data={item}
add={(createdFrom) => {
addItem(props.list, createdFrom, setTasks);
}}
update={(created, text) => {
updateItem(props.list, created, text, setTasks);
}}
delete={(created) => {
deleteItem(props.list, created, setTasks);
}}
finish={(created) => {
finishItem(props.list, created, setTasks);
}}
/>
)}
keyExtractor={(item) => {
return item.created
}}
showsHorizontalScrollIndicator={false}
/>
);
}
记录数据的属性给出:
1690929274428 0 'f' false