當我嘗試在 React Native 中添加到陣列的開頭時,出現以下錯誤:
TypeError: todos.unshift is not a function. (In 'todos.unshift(newTodo)', 'todos.unshift' is undefined)
我的代碼是:
export default function App() {
const [todos, setTodos] = useState(['Hello']);
const [todo, setTodo] = useState('');
function addItem(newTodo) {
console.log(newTodo);
setTodos(todos.unshift(newTodo));
}
return (
<TouchableWithoutFeedback
onPress={() => {
Keyboard.dismiss();
}}
>
<View style={styles.container}>
<TextInput
placeholder='new todo'
style={styles.input}
value={todo}
onChangeText={(text) => {
setTodo(text);
}}
></TextInput>
<Button title='Add' onPress={()=>addItem(todo)}></Button>
</View>
</TouchableWithoutFeedback>
);
}
為什么會這樣。useState 不是將 todos 的型別應用為陣列嗎?
uj5u.com熱心網友回復:
方法“unshift”不回傳修改后的陣列。你可以在這里看到它是如何作業的。
并且不建議在沒有 setState 方法的情況下改變狀態,因為在這種情況下 React 無法檢測到更改。
你可以setTodos(arr => [newTodo, ...arr])改用。
uj5u.com熱心網友回復:
您也可以嘗試這樣做,因為陣列 'unshift' 方法不回傳修改后的陣列。
首先使用擴展運算子克隆狀態,然后更新狀態。
function addItem(newTodo) {
let arrayToUpdate = [...todos];
arrayToUpdate.unshift(newTodo);
setTodos(arrayToUpdate);
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/353533.html
標籤:javascript 反应 反应原生
