I want to get 4 values from user and I want storage them in asyncStorage and list them main page.
first of all I have App.tsx like this:
App.tsx
const [objName,setObjName]= useState('') const [objAmount,setObjAmount]= useState(0) const [objCurr,setObjCurr]= useState(0) const [objNote,setObjNote]= useState('') const [time,setTime] = useState(0) const [visible, setVisible] = useState(false); const handleOnChangeName = (name) => {setObjName(name)}; const handleOnChangeAmount = (amount) => {setObjAmount(amount)}; const handleOnChangeCurr = (curr) => {setObjCurr(curr)}; const handleOnChangeNote = (note) => {setObjNote(note)}; const [objectives,setObjectives] = useState<PropType<any>>({id:-1,objectName:'dasasd',objectAmount:0,objectCurr:0,objectNote:'asdasd'}) const toggleBottomNavigationView = () => { setVisible(!visible); }; console.log(objAmount) const handleSubmit = async ()=>{ setTime(Date.now()) const objective={id:time,objectName:objName,objectAmount:objAmount,objectCurr:objCurr,objectNote:objNote} const updatedObj = [...objectives, objective] setObjectives(updatedObj) await AsyncStorage.setItem('objective',JSON.stringify(updatedObj)) setObjName(''); setObjAmount(0); setObjCurr(0); setObjNote(''); toggleBottomNavigationView(); } const deleteAll=()=> { AsyncStorage.clear() Alert.alert('Silme İşlemi Başarılı!') } const getObjectives= async () =>{ const result= await AsyncStorage.getItem('objective') console.log(JSON.parse(result)) setObjectives(JSON.parse(result)) } useEffect(()=> { getObjectives(); },[]) return (<SafeAreaProvider style={styles.container}><View style={styles.navbar} ><Text style={{color:'white',fontSize:25}}>SELF PLANNER</Text></View><View style={styles.content}><ScrollView><View style={styles.row} ><AddBlocker funct={toggleBottomNavigationView} /></View> <TouchableOpacity onPress={deleteAll} style={{backgroundColor:'red', height:50,width:70,alignSelf:'center' ,marginTop:10, borderRadius:10, padding:10 }}><Text style={{color:'white'}}>Delete</Text></TouchableOpacity><View style={{justifyContent:'center'}}></View><BottomSheet visible={visible} onBackButtonPress={toggleBottomNavigationView} onBackdropPress={toggleBottomNavigationView}><View style={styles.bottomNavigationView}><View style={styles.headerInput} ><Text style={{fontSize:25,color:'#7B3B75',fontWeight:'bold'}} >Manuel Seçim</Text></View><View style={styles.contentInput} ><Text style={styles.label} >Hedef Adı</Text><TextInput value={objName} onChangeText={handleOnChangeName} style={styles.textInput} /><Text style={styles.label} >Hedefin Maaliyeti (₺)</Text><TextInput keyboardType='numeric' value={objAmount} onChangeText={handleOnChangeAmount} style={styles.textInput} /><Text style={styles.label} >Başlangıç Sermayeniz (₺)</Text><TextInput keyboardType='numeric' value={objCurr} onChangeText={handleOnChangeCurr} style={styles.textInput} /><Text style={styles.label} >Başlangıç Notunuz</Text><TextInput value={objNote} onChangeText={handleOnChangeNote} style={styles.textInput} /><View style={{flexDirection:'column',justifyContent:'center',width:'50%',height:'2%'}}><TouchableOpacity onPress={handleSubmit} style={{backgroundColor:'#7C3E66',width:'100%',height:'75%',margin:85,justifyContent:'center',alignItems:'center',borderRadius:50, }} activeOpacity={1}><Text style={{fontSize:25,color:'white',fontWeight:'bold'}}>Ekle</Text></TouchableOpacity></View></View></View> </BottomSheet></ScrollView></View></SafeAreaProvider> );}const styles= StyleSheet.create( { container:{ flex:1, }, navbar:{ flex:1, backgroundColor:'#7C3E66', flexDirection:'row', justifyContent:'center', alignItems:'center', }, content:{ flex:7, backgroundColor:'#F2EBE9', flexDirection:'column' }, row:{ flexDirection:'row', justifyContent:'center', width:'100%', }, bottomNavigationView: { backgroundColor: '#fff', width: '100%', height: 500, alignItems: 'center', }, contentInput:{ width:'100%', height:'800%', padding:20 }, headerInput:{ width:'100%', height:'10%', alignItems:'center', justifyContent:'center' }, textInput: {backgroundColor:'#F5F5F5',width:'100%',height:'1%',borderRadius:50,paddingLeft:15,color:'black',fontWeight:'bold'}, label:{marginBottom:10,marginTop:5,fontSize:17,marginLeft:10, color:'#7B3B75',fontWeight:'bold',}, buttonTextInput:{ backgroundColor:'', } })When I click Button it gives the warning and it does not storage the values:
Warning:
Possible Unhandled Promise Rejection (id: 0):TypeError: null is not an object (evaluating 'iter[Symbol.iterator]')_iterableToArray@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:3470:46_toConsumableArray@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:3456:131http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:112245:68generatorResume@[native code]asyncGeneratorStep@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:24715:26_next@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:24737:29http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:24744:14tryCallTwo@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:28940:9doResolve@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:29104:25Promise@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:28963:14http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:24733:25handleSubmit@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:112256:26_performTransitionSideEffects@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:65273:22_receiveSignal@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:65215:45onResponderRelease@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:65055:34invokeGuardedCallbackProd@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:3940:21invokeGuardedCallback@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:4044:42invokeGuardedCallbackAndCatchFirstError@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:4048:36executeDispatch@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:4124:48executeDispatchesInOrder@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:4144:26executeDispatchesAndRelease@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:5493:35forEach@[native code]forEachAccumulated@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:4674:22runEventsInBatch@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:5517:27runExtractedPluginEventsInBatch@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:5597:25http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:5572:42batchedUpdates$1@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:17982:20batchedUpdates@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:5479:36_receiveRootNodeIDEvent@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:5571:23receiveTouches@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:5625:34__callFunction@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:3057:36http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:2781:31__guard@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:3008:15callFunctionReturnFlushedQueue@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.myapp&modulesOnly=false&runModule=true:2780:21callFunctionReturnFlushedQueue@[native code]And the lines gives red problem on vscode:1 Parameter 'name' implicitly has an 'any' type.2 Parameter 'amount' implicitly has an 'any' type.3 Parameter 'curr' implicitly has an 'any' type.4 Parameter 'note' implicitly has an 'any' type.
5 Type 'PropType' is not generic.ts(2315)
6 -7 Argument of type 'string | null' is not assignable to parameter of type 'string'.Type 'null' is not assignable to type 'string'.ts(2345)
1 const handleOnChangeName = (name) => {setObjName(name)};2 const handleOnChangeAmount = (amount) => {setObjAmount(amount)};3 const handleOnChangeCurr = (curr) => {setObjCurr(curr)};4 const handleOnChangeNote = (note) => {setObjNote(note)};5 const [objectives,setObjectives] = useState<PropType<any>>({id:-1,objectName:'dasasd',objectAmount:0,objectCurr:0,objectNote:'asdasd'})6 console.log(JSON.parse(result))7 setObjectives(JSON.parse(result))Thanks for all advices and helps.