AsyncStorage.getItem in reactネイティブが期待どおりに動作しない

Question

AsyncStorageを使用してデータを取得しようとしています。私が自分のアクションクリエータを呼び出すたびにrequestDataと渡されたデータのコンソールを実行すると、私は以下のようになります。私はgetItemの2つのバージョンを持っています。両方のバージョンでプロパティフィールドの無駄な値を取得します。プロパティ値は読み取り可能である必要があります。

{"fromDate"： "20160601"、 "toDate"： "20160701"、 "property"：{"_ 40"：0、 "_ 55"：null、 "_72"：ヌル}、 "URL"： "/ ABC/ABC/XYZ"}

async getItem(item) { 
    let response = await AsyncStorage.getItem(item); 
    let responseJson = await JSON.stringify(response); 
    return responseJson; 
} 


async getItem(item) { 
    try { 
    const value = AsyncStorage.getItem(item).then((value) => { console.log("inside componentWillMount method call and value is "+value); 
    this.setState({'assetIdList': value}); 
    }).then(res => { 
    return res; 
    }); 
    console.log("----------------------------value--------------------------------------"+value); 
    return value; 
    } catch (error) { 
    // Handle errors here 
    console.log("error is "+error); 
    } 
} 

componentWillMount() { 
    requestData({ 
     fromDate: '20160601', 
     toDate: '20160701', 
     assetId: this.getItem(cmn.settings.property), 
     url: '/abc/abc/xyz' 
    }); 
    } 

Answer 1

あなたは約束としてプロパティを取得している、あなたはそれを解決する必要があります。 リンクを使ってみてください。

assetId: this.getItem(cmn.settings.property).then((res) => res) 
 
      .catch((error) => null);

Answer 2

AsyncStorageは本質的に非同期であるので、あなたはそれがオブジェクトを返すのを待つ必要があるでしょうし、その後あなたrequestDataメソッドを呼び出します。次のようなもの -

class MyComponent extends React.Component { 
    componentWillMount() { 
    this.retrieveFromStorageAndRequestData(); 
    }  

    async getItem(item) { 
    let response = await AsyncStorage.getItem(item); 
    // don't need await here since JSON.stringify is synchronous 
    let responseJson = JSON.stringify(response); 
    return responseJson; 
    } 

    async retrieveFromStorageAndRequestData =() => { 
    let assetId = await getItem(cmn.settings.property); 
    requestData({ 
     fromDate: '20160601', 
     toDate: '20160701', 
     assetId, 
     url: '/abc/abc/xyz' 
    }) ; 
    } 

    // rest of the component 

    render() { 
    // render logic 
    } 
}