asyncstorage에 저장된 json 객체의 반환 값이 반응식입니다.

Question

json 객체를 AsyncStorage에 저장 했으므로 이제 그 값을 가져 오려고합니다.

실제 코드에서 인쇄되는 값은 [object Object]입니다.

개체 안에 중첩 된 json 값을 인쇄하고 싶습니다.

팁이 있습니까?

import React, { Component } from 'react'; 

import { 
    Text, 
} from 'react-native'; 

    class Inside extends Component { 

     render() { 
      async function getItem(item) { 
      try { 
       const value = await AsyncStorage.getItem(item).then((val) => { 
       return JSON.parse(val); 
       }); 
       return value; 
      } catch (err) { 
       if(err) { 
       throw err; 
       } 
      } 
      } 
      return (
      <Text>{getItem('userdata').toString()}</Text> 
     ); 
     } 
     } 

    export default Inside; 

Answer 1

당신은 캐릭터 라인 화하는 경우 {이메일을 'test@test.com'} 다음은 이메일의 값을 구문 분석 할 수 AsyncStorage를 사용하여 저장 :

let value = await getItem('userdata'); 
return (
     <Text>{JSON.parse(value).email}</Text> 
     ); 

Answer 2

이와 몇 가지 문제가 있습니다 당신의 수업.

렌더링에서 함수 또는 직접 함수 호출 (특히 비동기 함수)을 원하지 않는 것이 이상적입니다.

외부의 비동기 함수를 작성 렌더링의 constructor 또는 componentDidMount 수명주기 동안 함수를 호출 setState를 가진 구성 요소의 상태를 업데이트하는 결과를 전송하는 것이 작업을 수행 할 수있는 적절한 방법, 및의 상태가 렌더링 것을 참조.

이것은 가 방법으로 반응 더 많거나 ... 적은 것 :

class Inside extends Component { 
    constructor() { 
    super() 
    this.state = { 
     itemString: "", 
    } 

    this.item = this.getItem('userdata') 
    } 

    async getItem(item) { 
    try { 
     const value = await AsyncStorage.getItem(item).then(val => { 
     this.setState({ itemString: val }) 
     return JSON.parse(val) 
     }); 
     return value 
    } catch (err) { 
     throw err 
    } 
    } 

    render() { 
    return (
     <Text>{this.state.itemString}</Text> 
    ); 
    } 
} 

export default Inside