React Native-基于条件的过滤器本机基拾取器项目



我想跳过Picker项目中的特定帐户,因此我通过了该帐户以从父母那里跳到子女中,但是它的生成错误表示

 error occured:TypeError: TypeError: TypeError: second argument to Function.prototype.apply must be an Array-like object (evaluating '[].concat.apply([],t.children)')

我提到了此处提供的解决方案关联。我有从帐户到下拉账户,我想跳过从"到帐户"下拉账户中的所选帐户。这是我的孩子组件

    import React, { Component } from "react";
import { Picker, Icon } from "native-base";
import { Dimensions, Platform } from "react-native";
export default class accountsDropDown extends Component {
    constructor(props) {
        super(props);
    }
    render() {
        console.log('skipped Acct:'+JSON.stringify(this.props.skipAcct))
        let filteredItems = null ;
        if(this.props.accounts !== undefined && this.props.accounts.acctId != null){
            filteredItems = this.props.accounts;
        }
        if(filteredItems != null && this.props.skipAcct !== undefined && this.props.skipAcct.acctId != null){
            filteredItems = filteredItems.filter(acct=>{
                return acct.acctId == this.props.skipAcct.acctId ? false :true;
            })
        }
        console.log('filteredItems:'+JSON.stringify(filteredItems))
        return (
            <Picker
                selectedValue={this.props.selectedValue}
                mode="dropdown"
                iosHeader="Choose To Account"
                style={{ width: Platform.OS === "ios" ? undefined : Dimensions.get("window").width }}
                iosIcon={<Icon name="arrow-down" />}
                onValueChange={value => this.props.onValueChange(value)}
            >
                {filteredItems != null &&
                    filteredItems.map(acct => {
                        return <Picker.Item key={acct.acctId} label={acct.desc} value={acct} />;
                    })}         
            </Picker>
        );
    }
}

这是我的父组件

<View style={styles.item}>
                            <Text note>From Account</Text>
                            <AccountsDropDown
                                selectedValue={this.state.fromAcct}
                                accounts={this.state.xferSrcAccts}
                                navigation={this.props.navigation}
                                onValueChange={itemValue => this.setState({ fromAcct: itemValue })}
                            />
                        </View>
                        <View style={styles.item}>
                            <Text note>To Account</Text>
                            <AccountsDropDown
                                selectedValue={this.state.toAcct}
                                skipAcct = {this.state.fromAcct}
                                accounts={this.state.xferDestAccts}
                                navigation={this.props.navigation}
                                onValueChange={itemValue => this.setState({ toAcct: itemValue })}
                            />
                        </View>

我能够通过更改如下

来解决问题
    render() {
        console.log('skipped Acct:'+JSON.stringify(this.props.skipAcct))
        let filteredItems = [] ;
        if(this.props.accounts.length > 0){
            filteredItems = this.props.accounts;
        }
        if(filteredItems != null && this.props.skipAcct !== undefined && this.props.skipAcct.acctId != null){
            filteredItems = filteredItems.filter(acct=>{
                return acct.acctId == this.props.skipAcct.acctId ? false :true;
            })
        }
        console.log('filteredItems:'+JSON.stringify(filteredItems))
        if(filteredItems.length >0){
                return (
                    <Picker
                        selectedValue={this.props.selectedValue}
                        mode="dropdown"
                        iosHeader="Choose To Account"
                        style={{ width: Platform.OS === "ios" ? undefined : Dimensions.get("window").width }}
                        iosIcon={<Icon name="arrow-down" />}
                        onValueChange={value => this.props.onValueChange(value)}
                    >
                        {filteredItems.map(acct => {                    
                                return <Picker.Item key={acct.acctId} label={acct.desc} value={acct} />;
                            })}         
                    </Picker>
                );
            }
            return null;
    }
}

最新更新