Comments (14)
Its working now on both platforms.
How did you fix this?
from react-native-image-cache-hoc.
from react-native-image-cache-hoc.
I used this but it gives me always above mentioned error.
from react-native-image-cache-hoc.
from react-native-image-cache-hoc.
I am using below mention version -
"react": "16.0.0",
"react-native": "0.51.1"
import React ,{Component } from 'react';
import {View,Text,StyleSheet,ActivityIndicator,Alert,TouchableHighlight,TextInput,Platform,FlatList,TouchableOpacity,Image,AsyncStorage} from 'react-native';
import imageCacheHoc from 'react-native-image-cache-hoc';
class allVips extends Component{
render(){
var left = (
<Left style={{flex:1}}>
<Button onPress={() => this._sideMenuDrawer.open()} transparent>
<Icon name='ios-menu-outline'/>
</Button>
</Left>
);
return (
<Container>
<Content>
<View style={styles.MainContainer}>
{
this.state.isFetching && <View style={{ flex: 1}}>
<Spinner color='red' overlayColor='rgba(0, 0, 0, 0.5)' visible={this.state.isFetching} textContent={"Loading..."} textStyle={{color: '#2c3e50'}} />
</View>
}
<TextInput
style={styles.TextInputStyleClass}
onChangeText={(text) => this.SearchFilterFunction(text)}
value={this.state.text}
underlineColorAndroid='transparent'
placeholder="Search by Vips First Name and Last Name or by Company"
/>
<FlatList
data={this.state.vipArray}
removeClippedSubviews={true}
renderItem={({item}) => <View style={{flex:1, flexDirection: 'column',backgroundColor:'#2E3742', margin:1}}>
<View style={{backgroundColor:'#2E3742',alignItems:'center'}}>
{/* {
item.profile_image == ""?<Image style={styles.ImageComponentStyle} source = {require('../images/default.png')}/>:<Image style={styles.ImageComponentStyle} source = {{ uri: item.profile_image }} />
} */}
{
item.profile_image == ""?<CacheableImage style={styles.ImageComponentStyle} source = {require('../images/default.png')}/>: <CacheableImage style={styles.ImageComponentStyle} source={{uri:item.profile_image}} permanent={false} placeholder={defaultPlaceholderObject} />
}
</View>
<Text onPress={this.GetGridViewItem.bind(this, item)} style={styles.nameTextStyle} numberOfLines={1} >{item.firstname+' '+item.lastname}</Text>
<Text onPress={this.checkstatus.bind(this,item)} style={item.checkin_status==1? styles.ItemTextStyle2:styles.ItemTextStyle} numberOfLines={1} >{item.checkin_status == 1?'Welcomed':'To be Welcomed'}</Text>
</View>
}
numColumns = { 2 }
key = {'TWO COLUMN'}
keyExtractor={(item, index) => index}/>
</View>
</Content>
</Container>
);
}
}
export const CacheableImage = imageCacheHoc(Image, {
validProtocols: ['http','https']
});
export const defaultPlaceholderObject = {
component: ActivityIndicator,
props: {
style: { width:100,
height:100,
backgroundColor: '#dc143c'}
}
};
export default (allVips);
from react-native-image-cache-hoc.
Ok, and as a sanity check, you have tried this code with https images and confirmed that it works? Also, have you tried this with http images associated with a well known public image host to confirm it isn't an image server problem?
from react-native-image-cache-hoc.
It is not server issue before I used only HTTP URL with its working fine. But when I implemented react-native-image-cache-hoc library then I am getting an error. And its also working fine with https.
from react-native-image-cache-hoc.
What is the http url you are using?
This is the line your url is failing:
The next thing I would test is installing validator (https://github.com/chriso/validator.js/) in your workspace and testing your url like:
validator.isURL(yourUrl);
from react-native-image-cache-hoc.
Hi,
I got URL issues some URLs open directly in the browser but some asking to save dialog before opening it. I used the validator.isURL() checking.
from react-native-image-cache-hoc.
from react-native-image-cache-hoc.
Its working now on both platforms.
from react-native-image-cache-hoc.
Excellent, hope I was able to help you debug :-)
Have a good day.
from react-native-image-cache-hoc.
@pravesh19 how did you fix this? i have same problem.
from react-native-image-cache-hoc.
from react-native-image-cache-hoc.
Related Issues (20)
- Could not add resizeMode property to cacheable image HOT 5
- Usable with ImageBackground? HOT 6
- Image loading issue - Half images HOT 15
- Unable to determine remote image filetype HOT 4
- Static methods (cacheFile, flush) works only with default directory
- [Improvements] Request headers, filename, rejection callback
- how to get the cache size? HOT 3
- it will crash when given a wrong image uri HOT 2
- Make rn-fetch-blob a peer dependency
- Caching Folder absolute path
- Clear cache
- The image can't be cache if the link is in HTTP
- react-native link rn-fetch-blob throws error HOT 1
- Cacheable Image not working with ImageBackground which does not use a uri.
- [TypeError: Network request failed] in android HOT 1
- Getting the following exception when the image loads on iOS
- Warning: componentWillReceiveProps has been renamed HOT 1
- Caches images non-unique naming
- Package abandoned? HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-image-cache-hoc.