在数组 React Native 中插入文本输入

Question

这个应用程序的目标是通过单击下面通过 submitItem 表示的按钮将 TextInputs 和颜色状态插入一个名为 listPeople 的数组中，TextInputs 是 name 和 lastName 我得到从组件和color 我从this.props.route.params 得到。我放了一个console.log 来看看有什么问题，问题是当我在终端中启动代码时，它只会返回如下所示的颜色输出，甚至不是数组的形式。

终端

blue

屏幕

export class List extends Component {
      constructor(props) {
        super(props);
        this.state = {
          listPeople: [],
          name: '',
          lastName: '',
          color: '',
            };
      }
    
    
      submitItem = ( list ) => {       
        const  listPerson = {
            color: this.props.route.params,
            name: name,
            lastName: lastName,
          };
          this.setState({ listPeople: [...this.state.listPeople, listPerson]})
          console.log(listPeople)
      };
    
    
      
    
      render() {
        const { color } = this.props.route.params;
        return (
          <Container>
            <Header>
                <Button transparent>
                  <Icon
                    name="checkmark"
                    onPress={() =>
                      this.submitItem(
                        color,
                        this.state.name,
                        this.state.lastName,
                      )
                    }
                  />
                </Button>
            </Header>
            <View style={{ alignItems: "center" }}>
                  <TextInput
                    placeholder="name"
                    textAlign="center"
                    onChangeText={(name) => this.setState({ name })}
                  />
                  <TextInput
                    placeholder="lastName"
                    textAlign="center"
                    onChangeText={(lastName) => this.setState({ lastName })}
                  />
             </View>

Answer 1

我认为这是因为您在 this.submitItem 上传递了 3 个参数，试试这个：

submitItem = ( color, name, lastName) => {       
        const  listPerson = {
            color: this.props.route.params,
            name: name,
            lastName: lastName,
          };
          this.setState({ listPeople: [...this.state.listPeople, listPerson]})
          console.log(listPeople)
      };