React-Native 从 AsyncStorage 返回视图

我正在尝试从AsyncStorage渲染卡列表。我想做的是从存储中获取所有数据并根据这些数据创建卡列表。我可以看到函数内的存储数据，但无法返回视图。这是我所做的。

import {View,AsyncStorage} from "react-native";
import { Container, Header, Content, Card, CardItem, Text, Body, Icon, Fab } 
from "native-base";

export default class extends Component{
 async _retrieveData(){
    const value = await AsyncStorage.getAllKeys();
    return value;
 };
 getAll(){
   this._retrieveData()
     .then(items =>{
       items.map(async (k) => {
         await AsyncStorage.getItem(k).then(ok => {
           var cards = [];
             cards.push(
               <Card key="">
                 <CardItem>
                   <Body>
                     <Text>
                       ok data
                     </Text>
                   </Body>
                 </CardItem>
               </Card>
             )
           return cards;
         });
       });
     })
     .catch(err =>{
       alert(err);
     });
   };

   render(){
       return(
         <Container>
           <Content padder>
           {this.getAll()}
           </Content>
         </Container>
       )
   }
}

你不能在渲染方法中调用 getAll 函数，因为它需要承诺才能解析。

您可以在 componenDidMount 方法中调用相同的函数，将卡片保存到本地状态，然后在 render 方法中呈现该数据。

相关内容

最新更新

热门标签：