请教一个navigator的问题
来源:
qq_superATC_03291580
2016-11-27
index.ios.js 页面
import React, { Component } from 'react';
import Icon from 'react-native-vector-icons/Ionicons';
//引入工具类
import Utils from './ios_app/utils';
//引入页面
import Main from './ios_app/main';
import Weiclass from './ios_app/weiclass';
import Videoclass from './ios_app/videoclass';
import Setting from './ios_app/settings';
import {
AppRegistry,
StyleSheet,
Text,
View,
Image,
StatusBar,
TabBarIOS,
Navigator
} from 'react-native';
export default class languiji extends Component {
constructor(props) {
super(props);
this.state = {
selectedTab: 'main'
};
}
render() {
return (
<View style={styles.container}>
<TabBarIOS
unselectedTintColor="#999"
tintColor="#53B5EF"
barTintColor="#F9F9F9">
<Icon.TabBarItem
title="发现"
iconName="ios-home-outline"
selectedIconName="ios-home-outline"
selected={this.state.selectedTab === 'main'}
onPress={() => {
this.setState({
selectedTab: 'main',
});
}}>
<Navigator
initialRoute={{ name: 'main', component: Main }}
configureScene={(route) => {
return Navigator.SceneConfigs.FloatFromRight;
}}
renderScene={(route, navigator) => {
let Component = route.component;
return <Component {...route.params} navigator={navigator} />
}} />
</Icon.TabBarItem>
<Icon.TabBarItem
title="微课堂"
iconName="ios-color-filter-outline"
selectedIconName="ios-color-filter-outline"
selected={this.state.selectedTab === 'weiclass'}
onPress={() => {
this.setState({
selectedTab: 'weiclass'
});
}}>
<Weiclass />
</Icon.TabBarItem>
<Icon.TabBarItem
title="系列课"
iconName="ios-film-outline"
selectedIconName="ios-film-outline"
selected={this.state.selectedTab === 'videoclass'}
onPress={() => {
this.setState({
selectedTab: 'videoclass'
});
}}>
<Videoclass />
</Icon.TabBarItem>
<Icon.TabBarItem
title="设置"
iconName="ios-cog"
selectedIconName="ios-cog"
selected={this.state.selectedTab === 'settings'}
onPress={() => {
this.setState({
selectedTab: 'settings'
});
}}>
<Setting />
</Icon.TabBarItem>
</TabBarIOS>
</View>
);
}
}
AppRegistry.registerComponent('languiji', () => languiji);
-----------------------------------------------------
main.js
import React, { Component } from 'react';
import Icon from 'react-native-vector-icons/Ionicons';
import Swiper from 'react-native-swiper';
//引入工具类
import Utils from './utils';
//引入子模版
import Header from './sub_components/header';
import AniImage from './sub_components/animg';
import TitleBox from './sub_components/titleBox';
import FuncTabs from './sub_components/funcTabs';
//引入子页面
import Weivideo from './weivideo';
import {
AppRegistry,
StyleSheet,
Text,
View,
Image,
StatusBar,
ScrollView,
ListView,
RefreshControl,
TouchableOpacity
} from 'react-native';
//最新微课列表子组件
export class NewWeiClassList extends Component{
constructor(props) {
super(props);
let row = this.props.row;
this.state = {
row: row
}
}
render(){
let row = this.state.row;
return(
<TouchableOpacity onPress={this.props.onSelect}>
<View style={styles.classItem}>
<AniImage
inputRange={[0, 100]}
outputRange={[0, 1]}
url={Utils.APIs.WEICLASSIMG + row.folder + '.jpg'}
style={styles.classImg}
/>
<View style={styles.classnameBox}></View>
<View style={styles.classnameBox2}>
<Text style={styles.classnameText} numberOfLines={1}>{row.classname}</Text>
</View>
</View>
</TouchableOpacity>
)
}
}
export class main extends Component {
constructor(props) {
super(props);
let ds = new ListView.DataSource({
rowHasChanged: (r1, r2) => r1 !== r2
})
this.state = {
isRefreshing: false,
headerTitle: '蓝轨迹',
weiClassDataSource: ds.cloneWithRows([])
};
}
//最新微课列表视图
weiClassRenderRow(row){
return <NewWeiClassList
key={row.id}
---->问题在这一行!两种都显示同样的错误,见最后的图 onSelect={() => this._openWeiVideo(row)}
//onSelect={() => this._openWeiVideo(row).bind(this)}
row={row}
/>
}
componentDidMount(){
this._fetchWeiClassList();
this._fetchHotWeiClassList();
this._fetchBestClassList();
}
_onRefresh() {
if(this.state.isRefreshing){
return;
}
this.setState({
isRefreshing: true
});
setTimeout(() => {
this._fetchWeiClassList();
this._fetchHotWeiClassList();
this._fetchBestClassList();
this.setState({
isRefreshing: false
});
}, 2000);
}
_openWeiVideo(row){
this.props.navigator.push({
name: 'weivideo',
component: Weivideo,
params:{
row: row
}
})
}
//获取10节最新微课
_fetchWeiClassList(){
var that = this;
let formData = new FormData();
formData.append("num", 10);
Utils.post(Utils.APIs.BASE + 'getManyWeiClassList', formData, function(responseJson){
that.setState({
weiClassDataSource: that.state.weiClassDataSource.cloneWithRows(responseJson)
})
},function(error){
console.log(error);
})
}
render(){
return(
<View style={styles.container}>
<StatusBar
barStyle={'light-content'}
/>
<Header title={this.state.headerTitle} />
<ScrollView
automaticallyAdjustContentInsets={false}
showsVerticalScrollIndicator={false}
refreshControl={
<RefreshControl
refreshing={this.state.isRefreshing}
onRefresh={this._onRefresh.bind(this)}
tintColor="#4188C6"
/>
}
>
<View style={styles.topicBox}>
<TitleBox title="最新微课"
rightText="更多"
hasBottomBorder="false"
/>
<ScrollView style={styles.topicSV}
automaticallyAdjustContentInsets={false}
showsHorizontalScrollIndicator={false}
>
<ListView
dataSource={this.state.weiClassDataSource}
renderRow={this.weiClassRenderRow}
enableEmptySections={true}
horizontal={true}
showsHorizontalScrollIndicator={false}
/>
</ScrollView>
</View>
</ScrollView>
</View>
)
}
}
module.exports = main;
3回答
-
renderRow={this.weiClassRenderRow}
这个有 bind this 么
renderRow={this.weiClassRenderRow.bind(this)}
012016-11-27 -
qq_superATC_03291580
提问者
2016-11-27
已解决!加上了.bind(this) renderRow={this.weiClassRenderRow.bind(this)}
onSelect={() => this._openWeiVideo(row)}
012017-08-18 -
qq_superATC_03291580
提问者
2016-11-27
加上了.bind(this) renderRow={this.weiClassRenderRow.bind(this)} onSelect={() => this._openWeiVideo(row).bind(this)}
00
相似问题