Обработка "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 }

в преакте.

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

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.

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