我正在尝试 for country in ['USA','ENGLAND','AUSTRALIA','CANADA']:
World.objects.get_or_create(country=country, language='English')
我的选择器。
import使用：
// picker.android.js
import React, { Component } from "react";
import { StyleSheet, Picker } from "react-native";
const PickerList = props => {
const { label, options, selectedValue, name, onChange, identifier } = props;
return (
<Picker
selectedValue={selectedValue}
onValueChange={onChange}
>
<Picker.Item
key={"unselectable"}
label={"Please select an option"}
value=""
/>
{options.map((option, i) => {
return <Picker.Item key={option.id} label={option.label} value={option.id} />;
})}
</Picker>
);
};
export default PickerList;
我不能让我的选择器显示，道具在那里，但我的选择器不会显示，当我调试道具时我得到参考错误：
ReferenceError：s未在eval中定义（eval at ReferenceError：t未在eval中定义
为什么会发生这种情况？如何显示我的import React, { Component } from "react";
import PropTypes from "prop-types";
import { connect } from "react-redux";
import {
View,
Text,
Image,
StyleSheet,
TouchableHighlight,
ActivityIndicator,
ImageBackground,
AsyncStorage,
Dimensions
} from "react-native";
import {
setYear,
setStudent,
setGroup,
setCredentials,
resetForm
} from "../actions/events";
import PickerList from "./common/Picker";
class HomeScreen extends Component {
static navigationOptions = {
title: ""
};
constructor(props) {
super(props);
this.state = { hideElement: false };
this.onLayout = this.onLayout.bind(this);
this.onSubmit = this.onSubmit.bind(this);
this.onParentChange = this.onParentChange.bind(this);
this.onGroupChange = this.onGroupChange.bind(this);
this.onStudentChange = this.onStudentChange.bind(this);
}
componentWillMount() {
}
onParentChange(e) {
this.props.resetForm();
this.props.setYear(e);
}
onGroupChange(e) {
if (e !== "") {
const {
credentials: { year },
categories
} = this.props;
this.props.setGroup(e, categories, year);
}
}
onStudentChange(e) {
if (e !== "") {
this.props.setStudent(e);
}
}
onSubmit(e) {
AsyncStorage.setItem(
"loggedIn",
JSON.stringify(this.props.credentials)
);
this.props.navigation.navigate("Month");
}
onLayout(e) {
const { width, height } = Dimensions.get("window");
if (width > height) {
this.setState({ hideElement: true });
} else {
this.setState({ hideElement: false });
}
}
render() {
const {
isLoading,
categories,
hasErrored,
isLoadingCredentials,
credentials: { year, group, student, showStudent }
} = this.props;
return (
<View
style={styles.container}
onLayout={this.onLayout.bind(this)}
>
<View style={{ backgroundColor: "white" }}>
<PickerList
selectedValue={year}
label="Year"
onChange={this.onParentChange}
options={categories}
style={styles.picker}
/>
</View>
</View>
);
}
}
const mapStateToProps = state => {
return {
categories: state.fetchCategories,
isLoading: state.isLoading,
hasErrored: state.hasErrored,
credentials: state.setCredentials,
isLoadingCredentials: state.isLoadingCredentials
};
};
const mapDispatchToProps = dispatch => ({
isLoadingCredentials: loadingCredentials =>
dispatch(isLoadingCredentials(loadingCredentials)),
setCredentials: credentials => dispatch(setCredentials(credentials)),
setYear: year => dispatch(setYear(year)),
setGroup: (group, categories, year) =>
dispatch(setGroup(group, categories, year)),
setStudent: student => dispatch(setStudent(student)),
resetForm: () => dispatch(resetForm())
});
export default connect(mapStateToProps, mapDispatchToProps)(HomeScreen);
const styles = StyleSheet.create({
container: {
flexDirection: "column",
justifyContent: "center",
alignItems: "center",
display: "flex",
marginTop: 25
},
button: {
alignItems: "center",
backgroundColor: "#800080",
padding: 10
},
picker: {
width: 300,
height: 30
},
buttonText: {
color: "white"
},
logo: {
flex: 1,
width: 300,
height: 100,
resizeMode: "contain"
}
});
/>
？
更新
我可以映射选项并显示它们，当我将Picker放入Picker时它不会显示：
jsx答案 0 :(得分：0)
您应该尝试在拾取器上放置一些高度和宽度：
<Picker
selectedValue={selectedValue}
onValueChange={onChange}
style={{ height: 200, width: 400 }}
>
...
</Picker>