這是解碼代碼:
import { View, TextInput } from 'react-native';
import { styles } from './styles';
import { useState } from 'react';
import { getData } from '../../controllers/storages';
export default function Profile() {
const [name, setName] = useState('');
getData('user').then((res)=>{
let a = JSON.parse(res)
setName(a.name)
})
return (
<View style={styles.contender}>
<View>
<TextInput style={styles.email}
onChangeText={newText => setName(newText)}
defaultValue={name}
placeholder="Enter username"
/>
</View>
</View>
);
}
我name從服務器獲取值并在輸入中列印,效果很好,但是當我嘗試修改該值時,它會很快恢復到原始值。我一直在閱讀執行緒,我發現最相似的是:
具有值的 TextInput 不會改變值
他們把這個鏈接https://reactnative.dev/docs/handling-text-input這很有趣,但在我的情況下不起作用,我相信這是因為他們從一開始就使用空字串。我無法遵循的其他答案,當他們提到this.state物件資訊時,我會迷路。
我也嘗試將屬性更改value為defaultValue如您所見,但仍然無法正常作業。
我只想列印來自服務器的輸入中的值,并且還能夠更改它并將其放入相同的 useState 變數(名稱)中
uj5u.com熱心網友回復:
每次更改名稱的狀態時,都會重新渲染組件,以便呼叫函式 getData。
如果你只想在你的組件第一次掛載時呼叫你的服務器,你應該使用 useEffect。
import { View, TextInput } from 'react-native';
import { styles } from './styles';
import { useState,useEffect } from 'react';
import { getData } from '../../controllers/storages';
export default function Profile() {
const [name, setName] = useState('');
useEffect(getData('user').then((res)=>{
let a = JSON.parse(res)
setName(a.name)
}),[]);
return (
<View style={styles.contender}>
<View>
<TextInput style={styles.email}
onChangeText={newText => setName(newText)}
defaultValue={name}
placeholder="Enter username"
/>
</View>
</View>
);
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/457205.html
上一篇:從底部選項卡導航器單擊導航堆疊時如何回傳到導航堆疊的某些組件
下一篇:無法執行反應狀態取消rtk查詢
