视频不能播放
来源：
houlonglong
2017-01-09
我的是视频底部能播放
代码
var React = require('react')
var Reactnative = require('react-native');
var Icon = require('react-native-vector-icons/Ionicons');
var Video = require('react-native-video').default;
var Component = React.Component;
var AppRegistry = Reactnative.AppRegistry;
var StyleSheet = Reactnative.StyleSheet
var Text = Reactnative.Text
var View = Reactnative.View
var Dimensions = Reactnative.Dimensions
var width = Dimensions.get('window').width
//第一个组件组件
var Detail = React.createClass({
getInitialState(){
var data = this.props.data;
console.log(data)
return {
data:data,
rate:0,
muted:false,
resizeMode:'cover',
repeat:false
}
},
_backToList(){
this.props.navigator.pop()
},
_onLoadStart(){
console.log('开始加载视频')
},
_onLoad(){
console.log('加载视频')
},
_onProgress(data){
console.log('加载onProgress')
},
_onEnd(){
console.log('加载结束')
},
_onError(){
console.log('加载错误')
},
render:function(){
var data = this.props.data
return(
<View style={styles.container}>
<Text onPress={this._backToList}>详情页面</Text>
<View style={styles.videoBox}>
<Video
ref='videoPlayer'
source={{uri: data.video}}
style={styles.video}
volume={5}
paused={false}
rate={this.state.rate}
muted={this.state.muted}
resizeMode={this.state.resizeMode}
repeat={this.state.repeat}
onLoadStart={this._onLoadStart}
onLoad={this._onLoad}
onProgress={this._onProgress}
onEnd={this._onEnd}
onError={this._onError} />
</View>
</View>
)
}
})
var styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
videoBox: {
width:width,
height:360,
backgroundColor:'#000',
},
video:{
width:width,
height:360,
backgroundColor:'#000',
}
});
module.exports = Detail
1回答
-
Scott
2017-01-09
参考补录的那一章重新走一遍，把 RN 版本和 video 版本都升级一下，然后代码的的写法，也从 ES5 进化到 ES6，应该这些问题都能迎刃而解了，比如：
import Icon from 'react-native-vector-icons/Ionicons' import Video from 'react-native-video'
00
相似问题