react native base picker component can not read property 'item' of undefined

Question

我正在使用 Picker 创建一个简单的组件，但是当我尝试使用原始网站文档中提到的 时，我收到错误消息：

代码中也使用了 Picker 组件，但编译器没有问题。

无法读取未定义的属性“项目”

这里是代码：

import React, { useState } from "react";
import { StyleSheet, View } from "react-native";
import { Picker } from "native-base";
import { TextInput } from "react-native-paper";

export default function AddScreen() {
  const [name, setName] = useState(undefined);
  const [data, setData] = useState(undefined);
  const [type, setType] = useState(undefined);

  const onTypeChanged = (value) => {
    setType(value)
  }

  return (
    <View style={styles.container}>
      <TextInput
        label="Name"
        value={name}
        onChangeText={(text) => {
          setName(text);
        }}
      />
      <TextInput
        label="Data"
        value={data}
        onChangeText={(text) => {
          setData(data);
        }}
        style={{
          marginTop: 20,
        }}
      />

      <Picker
        mode="dropdown"
        style={{ width: 120 }}
        selectedValue={null}
        onValueChange={onTypeChanged.bind(this)}
        placeholder = "Select Data Type"
      >
{/* can not read property 'item' of undefined */}
        <Picker.Item label="Links" value="links" />
        <Picker.Item label="Location" value="location" />
        <Picker.Item label="Phone" value="phone" />
        <Picker.Item label="Website" value="website" />
        <Picker.Item label="Email" value="email" />
      </Picker>
    </View>
  );
}



const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    padding: 20,
  },
});

Answer 1

尝试以下更改：

const [type, setType] = useState("links"); 

//...

 <TextInput
        label="Data"
        value={data}
        onChangeText={(text) => {
          setData(text);
        }}
        style={{
          marginTop: 20,
        }}
      />
//... 

  <Picker
        mode="dropdown"
        style={{ width: 120 }}
        selectedValue={type}
        onValueChange={onTypeChanged.bind(this)}
        placeholder="Select Data Type"
      >