Как правильно перенаправить ссылку на материал-пользовательский интерфейс из функционального компонента - PullRequest
1 голос
/ 26 марта 2020

Я использую следующие пакеты для создания решения автозаполнения для приложения, над которым я работаю:

Я пытаюсь использовать опору Component для элемента response-autocomplete-input, передавая компонент material-ui TextareaAutosize.

Непосредственный переход в TextareaAutosize из MUI

import {TextareaAutosize} from '@material-ui/core';
<AutocompleteInput Component={TextareaAutosize} />

Это работает, однако я не имею никакого контроля над реквизитами, которые он получает.

Через пользовательский компонент, чтобы я мог добавить реквизиты

const CustomTextarea = forwardRef((props, ref) => (
  // If I don't forward the ref I get an error...
  <TextareaAutosize
    placeholder="Material-ui through custom component..."
    ref={ref}
  />
));

<AutocompleteInput Component={CustomTextarea} />

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

Вы можете увидеть все примеры в моей песочнице ниже.

Примеры: https://codesandbox.io/s/frosty-wildflower-48iyd

1 Ответ

1 голос
/ 26 марта 2020

Вы только что пропустили прохождение по умолчанию реквизит

const CustomTextarea = forwardRef((props, ref) => (
  // If I don't forward the ref I get an error...
  <TextareaAutosize
    placeholder="Material-ui through custom component..."
    {...props} // here
    ref={ref}
  />
))
...