Code
App.js
useEffect(() => { axios .get( `https://newsapi.org/v2/everything?q=bitcoin&apiKey=6529d29d039d45d591fc53ee553c0e92` ) .then(response => { // console.log(response.data.articles) setNews(response.data.articles); setLoading(false) }) .catch(error => { console.log(error); setLoading(true) });}, []);<ScrollView> {news.map((article) => (<><Card containerStyle={styles.card}><Card.Image key={article.urlToImage} source={{ uri: !article.urlToImage ? "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTDZLgldd2q0XXCd-lobijWU4aNMdPMfoaOKLxOTmdC&s" : article.urlToImage }} /><Card.Divider /><Text numberOfLines={2} style={{ textAlign: 'left', color: '#000', fontFamily: 'Lobster', fontSize: RFPercentage(3), marginBottom: verticalScale(5) }} key={article.title}>{article.title}</Text><Text style={{ fontSize: RFPercentage(2.70), fontFamily: 'LobsterTwo-Bold', marginBottom: verticalScale(15) }} key={article.description} numberOfLines={3}> {article.description}</Text><Text key={article.author} style={{ fontFamily: 'LobsterTwo-Italic', fontSize: RFPercentage(2.30), marginBottom: scale(5), color: '#E02424' }}> {article.author == null ? "Unknow Author" : article.author} on {new Date(article.publishedAt).toGMTString()}</Text><TouchableOpacity style={styles.cardbtn}><Text style={{ fontFamily: 'Lobster', color: '#fff', fontSize: RFPercentage(3) }}>Read More</Text></TouchableOpacity></Card></> ))}</ScrollView>
Explanation
data is successfully fetched. in the data article.url
comes a link to the full news when I try to click the Read More
button it redirects to a google page and opens the link to which one comes I'm article.url
Button
<TouchableOpacity style={styles.cardbtn}><Text style={{ fontFamily: 'Lobster', color: '#fff', fontSize: RFPercentage(3) }}>Read More</Text></TouchableOpacity>
here is a button when I click the button it redirects me to google and opens a link Page like this example it's working but in my project not open any link
anyone can help me?