Как визуализировать компонент с ajax в реакции native?

Question

Мой код

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

Но я получил сообщение об ошибке, как показано ниже.

RawText "" должен быть обернут явным компонентом <Text>.

Answer 1

Я буду считать, что, основываясь на вашем псевдо-коде, вы знаете, как получить данные от AsyncStorage, что это Не очень хорошая идея, которая будет использовать AsyncStorage внутри вашей функции render, и что вы на самом деле не имеете в виду ajax, а скорее местное хранилище.

Но ошибка появляется, потому что вам нужно убедиться, что вы обертываете текст внутри элемента <Text>. Если вы посмотрите на this paragraph он говорит:

В React Native, мы более строгие об этом: вы должны обернуть все текстовые узлы внутри <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()} 
    ... 
);