Как получить все фильмы По найденному в Omdbapi React Native фильму - PullRequest
0 голосов
/ 13 сентября 2018

Я только начинаю изучать React Native, и это мой первый проект, в котором я пытаюсь получить фильмы из API OMDB через json.

Дело в том, что я хочу получить все фильмы из базы данных просто дляЭто легко, и моя проблема в том, что у меня нет идеи, как я могу получить все фильмы, я создал API, который выбирает только фильмы, относящиеся к «звезде», потому что я использую «звезду» в качестве типа поиска в этой ссылке API, опубликованной ниже, так чтоЕсть ли кто-нибудь, кто может помочь мне получить все фильмы?Спасибо ..

API ССЫЛКА, которую я использую для извлечения из OMDBAPI: http://www.omdbapi.com/?s=star&apikey=480344f1&r=json

Я также прикрепил файлы так, как я их получил, и все работает нормально.

Приложение.js

import React from 'react';
import DetailsScreen from './screens/DetailsScreen'
import SearchScreen from './screens/SearchScreen';

import { createStackNavigator } from 'react-navigation';

const StackNavigator = createStackNavigator({
  SearchStack: SearchScreen,
  InfoStack: DetailsScreen,
},
  {
    initialRouteName: 'SearchStack',
  },
);

export default class App extends React.Component {
  render() {
    return (
      <StackNavigator />
    );
  }
}

Api.js

export const fetchMovies = async () => {

 const response = await 
   fetch('http://www.omdbapi.com/?s=star&apikey=480344f1&r=json')
     const result = await response.json()
       return result
}

SearchScreen.js

export default class SearchScreen extends React.Component {
    static navigationOptions = {
        headerTitle: 'Home'
    }

    constructor(props) {
        super(props);

        this.state = {
            isLoading: true,
            search: '',
            movies: [],
        }
    }

    /*componentDidMount() {
        this.getMovies()
    } */

    getMovies = async (text) => {
        const result = await fetchMovies(text)
        this.setState({
            movies: result.Search,
        });
    }

    renderItem = item => {
        console.log('We are Rendering ...' + item);
        return (
            <TouchableOpacity
                style={{ alignItems: 'center', flexDirection: 'row', padding: 10,}}
                onPress={() => { this.props.navigation.navigate('InfoStack') }}>
                <Image style={{ height: 50, width: 50, justifyContent: 'center' }} source={{ uri: item.item.Poster }} />
                <View style={{ flexDirection: "column", marginLeft: 12,}}>
                <Text style={{ fontSize: 14, fontWeight: 'bold', justifyContent: 'center' }}>{item.item.Title}</Text>
                <Text style={{ fontSize: 14, justifyContent: 'center' }}>{item.item.imdbID}</Text>
                </View>
            </TouchableOpacity>
        );
    }

    separateItem = () => {
        return (
            <View style={{ height: 1, width: '100%', backgroundColor: 'black' }}>
            </View>
        );
    }

    render() {
        console.log("Fetched Movies in backend" + this.state.movies);
        return (

            <View style={styles.searchBox}>
                <SearchBar
                    lightTheme
                    placeholder="Search Here"
                    onChangeText={text => this.getMovies(text)} />


                <View style={styles.container}>
                    <FlatList
                        data={this.state.movies}
                        renderItem={this.renderItem}
                        keyExtractor={(item, index) => index}
                        ItemSeparatorComponent={this.separateItem}
                    />
                </View>
            </View>
        );
    }
}

1 Ответ

0 голосов
/ 14 сентября 2018

Здравствуйте, Гайз! Я только что получил ответ на этот вопрос от моего старшего брата.

Это так просто, что я просто изменяю. Я просто создаю параметр в моей функции fetchMovies под названием "searchMovie" и передаю его по ссылке api, вот и все, когда я запускаю проект и ищу любое слово. текст посмотрите код ниже. Спасибо ....!

Api.js

export const fetchMovies = async (searchMovie) => {

     const response = await 
       fetch('http://www.omdbapi.com/?s='+ searchMovie +'&apikey=480344f1&r=json')
         const result = await response.json()
           return result
    }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...