反应本机json解析
问题描述:
是否有可能删除/忽略反应原生应用程序中的特色图像,同时使用react-native-html-view
依赖关系从WordPress博客中获取数据?反应本机json解析
我使用:
"native-base": "^2.3.0",
"react": "16.0.0-alpha.12",
"react-native": "^0.46.4",
"react-native-fit-image": "^1.5.2",
"react-native-htmlview": "^0.12.0",
"react-native-interactable": "0.0.9",
"react-native-router-flux": "^3.38.0",
"react-native-vector-icons": "^4.3.0",
"react-navigation": "^1.0.0-beta.11",
"wpapi": "^1.1.2"
其实,我只需要博客没有图像的文本,并使用react-native-html-view
我得到的图像太这是不是我的要求。
import React, { Component } from 'react';
import {
ActivityIndicator,
ListView,
Text,
StyleSheet,
View
} from 'react-native';
import HTMLView from 'react-native-htmlview';
export default class Home extends Component {
constructor(props) {
super(props);
this.state = {
isLoading: true
}
}
componentDidMount() {
return fetch('http://www.cardory.co.uk/jan/json')
.then((response) => response.json())
.then((responseJson) => {
let ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
this.setState({
isLoading: false,
dataSource: ds.cloneWithRows(responseJson.items),
}, function() {
// do something with new state
});
})
.catch((error) => {
console.error(error);
});
}
render() {
if (this.state.isLoading) {
return (
<View style={{flex: 1, paddingTop: 60}}>
<ActivityIndicator />
</View>
);
}
return (
<View style={{flex: 1, paddingTop: 60}}>
<ListView
dataSource={this.state.dataSource}
renderRow={(rowData) =>
<Card>
<CardItem>
<Text style={styles.titleHeading}>{rowData.title}</Text>
</CardItem>
<CardItem>
<HTMLView value={rowData.content_html}/>
</CardItem>
</Card>
}
/>
</View>
);
}
}
const styles=StyleSheet.create({
textHeading:{
fontSize:20,
marginTop:20
},
titleHeading:{
fontSize:20,
fontWeight:'bold',
color:'black',
alignItems:'center',
}
});
module.export=Home;
答
您可以像跟踪,以便消除图像标签后传中HTMLView数据如果在HTML字符串中没有图像会显示没有图像
<HTMLView value={rowData.content_html.replace(/<img[^>]*>/g,"")}/>
它的作品,感谢您的答复! –