Как передать значение, извлеченное из тела json, в weburl в реакции native - PullRequest
Новая
       91

Как передать значение, извлеченное из тела json, в weburl в реакции native

0 голосов
/ 19 сентября 2019

i Я хочу получить URL-адрес из json и отобразить этот URL-адрес в веб-браузере inapp. Я пытался получить URL-адрес непосредственно из ответного json и передать его, но это не помогло. Я хочу передать выбранный URL-адрес в эту строку 'letresult = await WebBrowser.openBrowserAsync (this.dataUrl); '. Я хочу передать URL для нажатия кнопки, чтобы при каждом нажатии кнопки приложение открывало модуль браузера inapp и отображало URL. Пожалуйста, помогите мне и спасибо

import { Button, Text, View, StyleSheet,FlatList, ActivityIndicator } from 'react-native';
import * as WebBrowser from 'expo-web-browser';
import Constants from 'expo-constants';

export default class App extends Component {

  constructor(props){
    super(props);
    this.state ={ isLoading: true}
  }


  state = {
    result: null,
  };

  componentDidMount(){
    return fetch('https://newsapi.org/v2/top-headlines?sources=techcrunch&apiKey=54bea81097cf4e94a25b8c02118bf8d1')
      .then((response) => response.json())
      .then((responseJson) => {

        this.setState({
          isLoading: false,
          dataSource: responseJson.articles,
          dataUrl: responseJson.articles.url,
        }, function(){

        });

      })
      .catch((error) =>{
        console.error(error);
      });
  }

  render() {

     if(this.state.isLoading){
      return(
        <View style={{flex: 1, padding: 20}}>
          <ActivityIndicator/>
        </View>
      )
    }

    return (
      <View style={styles.container}>
      <FlatList
          data={this.state.dataSource}
          renderItem={({item}) => 
        <Button
          style={styles.paragraph}
          title="Open WebBrowser"
          onPress={this._handlePressButtonAsync}
        />
          }
          keyExtractor={({id}, index) => id}
        />
      </View>
    );
  }

  _handlePressButtonAsync = async () => {
    let result = await WebBrowser.openBrowserAsync(this.dataUrl);
    this.setState({ result });
  };
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    paddingTop: Constants.statusBarHeight,
    backgroundColor: '#ecf0f1',
  },
});````

Ответы [ 2 ]

0 голосов
/ 21 сентября 2019

это то, что я сделал. 

 <Body>
<Text numberOfLines={3} style={{ fontSize: 16,fontWeight:'bold' }}
 onPress={() => WebBrowser.openBrowserAsync(item.url)}
             >{item.title}</Text>
                <Text style={{ fontSize: 10 }}>{item.author}</Text>
                <Text style={{ fontSize: 10 }}>{item.publishedAt}</Text>
              </Body>
0 голосов
/ 20 сентября 2019

Если вы все настроили (ваши ответы правильно структурированы), и ответ успешен, единственное изменение, которое вы должны сделать - 

_handlePressButtonAsync = async () => {
    let result = await WebBrowser.openBrowserAsync(this.state.dataUrl);
    this.setState({ result });
};
...