很抱歉,这是一个愚蠢的问题,但我不知如何使用此npm软件包:https://www.npmjs.com/package/world-countries
就目前而言,我有这个库在RN https://github.com/gcanti/tcomb-form-native#rendering-options
中工作,我想添加一个附加字段,用户可以在其中选择他们来自哪个国家/地区。当我运行npm i world-countries
时,它已安装到我的依赖项中,仅此而已。我不清楚如何获得预期的功能。
请查看图片以查看我当前正在运行什么。
import React from "react";
import {
AppRegistry,
StyleSheet,
Text,
View,
TouchableHighlight
} from "react-native";
import t from "tcomb-form-native";
import Country from './components/countrys';
var Form = t.form.Form;
// here we are: define your domain model
var Person = t.struct({
name: t.String, // a required string
surname: t.maybe(t.String), // an optional string
age: t.Number, // a required number
Country: t.String, //a required country
rememberMe: t.Boolean, // a boolean
});
var options = {}; // optional rendering options (see documentation)
class AwesomeProject extends React.Component {
constructor(props) {
super(props);
//this.onPress = this.bind.onPress(this);
this.onPress = this.onPress.bind(this);
}
onPress() {
// call getValue() to get the values of the form
var value = this.refs.form.getValue();
if (value) {
// if validation fails, value will be null
console.log(value); // value here is an instance of Person
}
}
render() {
return (
<View style={styles.container}>
{/* display */}
<Form ref="form" type={Person} options={options} />
<TouchableHighlight
style={styles.button}
underlayColor="#99d9f4"
>
<Text style={styles.buttonText}>Save</Text>
</TouchableHighlight>
</View>
);
}
}
export default AwesomeProject;
var styles = StyleSheet.create({
container: {
justifyContent: "center",
marginTop: 50,
padding: 20,
backgroundColor: "#ffffff"
},
buttonText: {
fontSize: 18,
color: "white",
alignSelf: "center"
},
button: {
height: 36,
backgroundColor: "#48BBEC",
borderColor: "#48BBEC",
borderWidth: 1,
borderRadius: 8,
marginBottom: 10,
alignSelf: "stretch",
justifyContent: "center"
}
});