Добавление текста рядом с параметром в реакции выбора на основе значения

введите описание изображения здесь

Я работаю с response-select, и мне нужно добавить текст, как в картинке «категория по умолчанию», в зависимости от некоторых условий. Любой способ добиться этого?

Мой код:

renderCategories(categories) {
   const temp = [];
   categories.forEach((key) => {
        temp.push({label: key.name, value: key.id.toString()});
   });
   return temp;
}

<Field
 name="event_category"
 component={renderSelectField}
 placeholder="Select Event Category"
 options={this.renderCategories(categories)}
/>

где renderSelectField - это компонент Select для response-select, с использованием redux-form, а Categories - это массив объектов, содержащих id и name.


reactjs redux redux-form react-select
person Nikita Jajodia    schedule 26.02.2019    source источник
comment
Возможный дубликат Как могу ли я использовать response-select для настраиваемого подтекста рендеринга под каждым выпадающим списком?   -  person Laura    schedule 26.02.2019

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете сделать это, предоставив свой собственный шаблон Option для response-select. Немного похоже на:

const OptionLayout = props => {
  const { innerProps, innerRef } = props;
  return (
    <article ref={innerRef} {...innerProps} className={'custom-option'}>
      <h4>{props.data.artist}</h4>
      <div className={'sub'}>{props.data.title} </div>
    </article>
  );
};

<Select {...selectProps} components={{Option: OptionLayout}} />

Это не подходит для вашего макета, но должно дать вам все необходимое для создания собственного пользовательского Option шаблона.

person Steve -Cutter- Blades    schedule 26.02.2019