Есть ли способ использовать троичный оператор для отображения опции, подобной приведенной ниже?

#reactjs #ternary-operator

#reactjs #ternary-operator

Вопрос:

Я сопоставляю список задач и отображаю карточку для каждой. Внутри каждой карточки я заполняю поле выбора с помощью .map массива сотрудников. Это поле выбора используется для присвоения идентификатора пользователя объекту задачи, который находится в другой таблице. Интересно, есть ли способ добавить опцию в поле выбора, которая показывает, что задача в данный момент не назначена (идентификатор пользователя объекта задачи = «»). Я написал троичный оператор ниже, но он не дает желаемого результата.

Спасибо за вашу помощь!

Обновление, в настоящее время я пытаюсь…

 <label htmlFor="assignTo" className="assignToLabel">Assign To</label>
                                <select className="form-control"
                                    onChange={this.assignTo}
                                    id="assignTo" >

                                    {this.props.employees.map(employee => {
                                        if (this.props.task.userId == "") {
                                            return <option key="0" id="0" defaultValue="0" selected>
                                                Assign To:
                                            </option>
                                        } else if (employee.id === this.props.task.userId) {
                                            return <option key={employee.id} id={employee.id} defaultValue={employee.id} selected>
                                                {employee.name} {employee.surname}
                                            </option>
                                        } else {
                                            return <option key={employee.id} id={employee.id} value={employee.id} >
                                                {employee.name} {employee.surname}
                                            </option>
                                        }
                                    })}
                                </select>
  

Это также не работает, опция «Назначить» не возвращается. У кого-нибудь еще есть мысли по этому поводу?

Продолжаю благодарить!

Комментарии:

1. что вы получаете, когда идентификатор пользователя задачи равен 0

2. То же самое; Я ничего не получаю. Мне интересно, нужно ли мне возвращать параметр, хотя Visual Studio не нравится, как я пытаюсь вставить возврат в троичный.

3. Просто чтобы убедиться, что «this.props.task.userId» действительно строка, а не число?

4. проблема может быть this.props.task.userId === '0' . Может быть, это не строка, поэтому вы можете изменить ее на this.props.task.userId == '0' и проверить

5. Браво @ JS Engine, но лучший способ сделать это — сохранить «===» и обеспечить корректность типов, по крайней мере, с помощью «toString».