React Native Image not Rendering

I am building a simple React Native app in which if you search a book, it will find the google books image link stored in a database for that book and map it. However, I am getting an issue. The images aren't rendering on the app, and I've tried multiple solutions to fix this. None of them worked. Please help.

Here is my code:

class Search extends Component {
  constructor(props) {
    super(props);
    this.state = {
      search: '',
      loading: false,
      goBack: false,
      results: [],
    };
  }
  render() {
    return (
      <ScrollView style={{ backgroundColor: '#fff' }}>
        <Text></Text>
        <Text></Text>
        <View style={{ justifyContent: 'center', alignItems: 'center' }}>
          <Text style={{ fontSize: 30, marginTop: 20, textAlign: 'center' }}>
            Search
          </Text>
          <TextInput
            value={this.state.email}
            placeholder="Search For Books"
            autoCapitalize="none"
            selectionColor="black"
            underlineColor="black"
            underlineColorAndroid="black"
            style={{
              marginTop: 50,
              fontSize: 20,
              width: '75%',
              marginBottom: 25,
            }}
            onChangeText={(e) => {
              this.setState({ search: e });
            }}></TextInput>
          <Button
            //icon="login"
            mode="outlined"
            loading={this.state.loading}
            color="black"
            onPress={() => {
              axios
                .post('https://diversitylibrary.herokuapp.com/books/search', {
                  query: this.state.search,
                })
                .then((res) => {
                  console.log(res.data.results.map((obj) => obj));
                  this.setState({
                    results: res.data.results.map((obj) => obj),
                  });
                })
                .catch((err) => {
                  console.log(err);
                  alert(
                    'Something went wrong. Are you connected to the internet?'
                  );
                });
            }}
            contentStyle={{
              width: 175,
              height: 50,
              justifyContent: 'center',
              alignItems: 'center',
            }}>
            Search {'->'}
          </Button>

          <View>
            {this.state.results.map((result) => (
              <ScrollView>
                <Image
                  key="bookCover"
                  style={{ width: 200, height: 300 }}
                  source={{ uri: result.cover }}></Image>
                <Text>{result.title}</Text>
              </ScrollView>
            ))}
          </View>
        </View>
        <Text></Text>
        <Text></Text>
        <Text></Text>
        <Text></Text>
      </ScrollView>
    );
  }
}

export default Search;

Thanks. (Let me know if you need to see any other files.)