В методе onClick я не могу использовать .push дважды

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

constructor(props:any){
    super(props);
    this.state = {
        employees:[{name: 'joe', id: 12345},{name: 'kelly', id: 12321},{name: 'Jessica', id: 12255},{name: 'Paul', id: 98798}],
        ids:[],
        badgeID: '',
        currentEmployee: null
    }
}


check = () => {
    const {ids, badgeID, employees} = this.state

    let filteredEmployee = employees.filter(employee => {
        return employee.id === Number(badgeID)
    })

    this.setState({
        currentEmployee: filteredEmployee,
        drinkModal: true,
        ids: ids.push(badgeID)
    })
    console.info('ids', this.state.ids)
}


handleChangeEvent = (e: any, type: string) => {
    if (type === 'badge'){
        this.setState({badgeID: e.target.value})
    }
}

render(){
    return(
        <TextField onChange = {e => this.handleChangeEvent(e, 'badge')}/>
        <Button onClick = {this.check}>Add Employee</Button>
)}
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
0
52
2

Ответы 2

Ты делаешь:

ids: ids.push(badgeID)

Это сохраняет возвращаемое значение метода push, которое не является массивом, поэтому в следующий раз, когда вы вызовете push, он не будет работать. Вместо этого вам нужно сделать что-то вроде:

ids: [...ids, badgeID]

или же:

ids: ids.concat([badgeId])

другой вариант - сделать push перед рендерингом, но это его дело

Flavio 01.05.2018 23:01

Это потому, что ids.push возвращает длину нового массива: проверить документы

Обычно вы устанавливаете для ids целочисленное значение.

Другие вопросы по теме