Как вернуть опции реакции-выбора при наборе чего-либо внутри - PullRequest
Новая
       48

Как вернуть опции реакции-выбора при наборе чего-либо внутри

0 голосов
/ 02 мая 2020

Привет, у меня есть проблема с реагирующим выбором компонента. Я использую этот пакет и отправляю на этот выбор опций. Мне нужно отфильтровать оригинальный объект при наборе этого выбора.

Это мой компонент. только один метод и рендер 

selectLabel = [
        {
            label: '',
            options: [{
                label: '-Nič-',
                value: null,
            }],
        },
        {
            label: 'Balíky',
            options: [],
        },
        {
            label: 'Témy',
            options: [],
        },
        {
            label: 'Časti',
            options: [],
        },
        {
            label: 'Úlohy',
            options: [],
        },
    ];

 componentDidMount() {
        this.createLabelsForSearchBox();
    }


    createLabelsForSearchBox(){
        this.props.data.packages.forEach((pck) => {
            this.selectLabel[1].options.push({value: pck, label: pck.name});
        });

        this.props.data.packages.forEach((pckg) =>{
            pckg.themes.forEach((theme) =>{
                this.selectLabel[2].options.push({value: theme, label: theme.name});
            });
        });

        this.props.data.packages.forEach((pckg) =>{
            pckg.themes.forEach((theme) =>{
                theme.themeParts.forEach((part)=>{
                    this.selectLabel[3].options.push({value: part, label: part.name});
                });
            });
        });

        this.props.data.packages.forEach((pckg) =>{
            pckg.themes.forEach((theme) =>{
                theme.themeParts.forEach((part)=>{
                   part.knowledges.forEach((knowledge) => {
                        this.selectLabel[4].options.push({value: knowledge, label: knowledge.textPreview});
                    });
                });
            });
        });
    }


render() {
        return (
            <div>
                <Form className={'d-flex justify-content-center justify-content-md-start mt-2 mt-md-0'}>
                    <div className={'px-2 d-inline-block d-md-flex'}>
                        <div className={'d-flex align-items-center justify-content-center mb-2'}>
                            <Form.Group controlId="searchInput" className={'m-0 mr-2 flex-grow-1'}>
                                <Select
                                    options={this.selectLabel}
                                    onChange={((e) => console.log(e))}
                                    className={'search-input'}
                                />
                            </Form.Group>
                        </div>
                    </div>
                </Form>
            </div>
        );
    }

Теперь я хотел бы сделать метод changeMethod для этого выбора, где я получу фильтрованные параметры из этого выбора. Select как-то фильтрует данные, но я не могу найти никакой опции, чтобы получить этот отфильтрованный список снаружи. Это возможно? Или есть другой способ сделать это, может быть, лучше, пожалуйста?

Рабочий фрагмент здесь: https://codesandbox.io/s/objective-agnesi-sfhcs?file= / src / App. js

Зачем мне это нужно? Я должен отфильтровать это: My component

Это мой компонент, и он состоит из 4 подтипов Пакеты, Темы, Часть, Упражнения ... И мне нужно отфильтровать их во время выполнения

...