ajaxでコンポーネントをレンダリングする方法

Question

私のコードは

const main =() => { 
    let caption; 
    AsyncStorage.getItem("XXX", (err, result) => { 
    caption = <View>...</View> 
    }); 
    render (
    ... 
    {caption} 
    ... 
); 
} 

あるしかし、私は以下のようにエラーが発生しました。

RawText ""は、明示的な<Text>コンポーネントでラップする必要があります。

Answer 1

私はあなたの擬似コードに基づいて、それを前提とするつもりですが、あなたはどのように取得することを理解しますのデータ、それはではありません。はの中にあり、実際にはajaxという意味ではなくローカルストレージであることを意味します。

しかし、<Text>要素内にテキストをラップする必要があるため、エラーが表示されます。あなたはthis paragraphを見れば、それは言う：

では、ネイティブリアクト我々はそれについての詳細厳しいです：あなたは<Text>コンポーネントの内のすべてのテキストノードをラップする必要があります。テキストノードを<View>の直下に置くことはできません。

EDIT：

class MyComponent extends Component { 
    constructor(props) { 
    super(props); 

    this.state = { 
     data: '', 
    }; 
    } 

    componentDidMount() { 
    AsyncStorage.getItem('XXX', (err, result) => { 
     // @TODO: You should handle errors too 
     this.setState({ 
     data: result.text, 
     }); 
    }); 
    } 

    render() { 
    // Returning null will not render anything 
    // Once the results come in, it will update automatically 
    if (!this.state.data) return null; 
    // Raw text must be wrapped in Text 
    return (
     <Text>{this.state.data}</Text> 
    ); 
    } 
} 

Answer 2

あなたは状態の在庫データに試してみて、あなたのコンポーネントの聖霊降臨祭の機能を表示することができます

AsyncStorage.getItem("XXX", (err, result) => { 
    this.setState({result:result}) 
}); 

function element(){ 
    if([check if your state is not null]) 
    return(
     <View>... {this.state.result} ...</View> 
    ) 
} 

render (
    ... 
    {this.element()} 
    ... 
);