Обработка «ref» и «key» в различных библиотеках пользовательского интерфейса на основе виртуального DOM (React, Inferno, Preact и т. Д.)

Question

После вызова

<MyComponent x="aaa" y="bbb" key="0" ref={someRef}/>

объект props равен

{ x: 'aaa', y: 'bbb' }

в React и Inferno, но это

{ x: 'aaa', y: 'bbb', key: '0', ref: someRef }

inPreact.

Кто-нибудь знает причины этих разных дизайнерских решений и, возможно, некоторые преимущества и недостатки каждого решения?

Answer 1

Отказ от ответственности: я работаю над preact.

Передача реквизита key и ref в компонент была ошибкой, которую мы исправили в нашем следующем основном выпуске.Альфа должна приземлиться 4 марта 2019 года.

Существует даже открытый RFC для повторной передачи ref через props.Мы очень поддерживаем это изменение, потому что это сделает forwardRef избыточным.

Answer 2

Этот ответ взят из React GitHub Issues

Причина в том, что концепция ключа - это то, что контролируется внутренними компонентами React до создания вашего компонента.То же самое для реф.Вы можете думать о массиве ReactElements как о карте.

Карта - это серия из key и value кортежей.Фрагмент React представляет собой серию кортежей key и props (а также type и ref).Ключ предназначен для определения значения каждого слота, но не фактического значения.

Если вы читаете реквизит с именем key, вы можете перегрузить значение key или случайноиспользование его для чего-то не связанного.

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

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