-
-
Save a-x-/6bb5cbbc7312a120a8363dbb66639397 to your computer and use it in GitHub Desktop.
class Link extends PureComponent { | |
render () { | |
// Unusual useful omit application | |
const rest = omit(this.props, [ | |
'url', 'basePath', 'RouterLink', 'method', 'currentTab', 'disabled', 'children', 'className', | |
'title', 'confirm', 'onClick', 'onSuccess', 'onFailure', 'axiosProps', 'noExternalIcon', | |
]); | |
return isExternalUrl(this.props.url) | |
? this.renderExternalLink({ rest }) | |
: this.renderInternalLink({ rest }); | |
} | |
} |
Вообще конечно такие случаи заставляют усомнится в правильности ...rest и ещё раз посмотреть на domProps
Но тут есть два НО:
-
...rest
позволяет избежать неожиданностей при произовольном комбинировании компонентов пользователем. Если компоненты не ведут себе как обычные DOM-элементы, могут появляться баги, когда style например не пробрасывается или ещё какая фигня; Такое может случится например при замене<a
на<Link
пользователем или в условном подключении компонента или DOM-элемента
isCrazy ? <label { ...labelProps }/> : <Label { ...labelProps }/>
-
domProps чисто из-за нейминга не всегда подходят, иногда root — это другой компонент. Тут в идеале всё равно
...rest
нужно кинуть так, чтобы они легли на ближайший DOM-элемент, например
<Autosuggest inputProps={ ...rest } { ...autosuggestProps } />
опять же из-за соблюдения общего с DOM-элементами контракта и консистентности
tl;dr: Итого, юзаем ...rest
и кидаем на DOM
Юзаем спред-дестракчеринг, но когда неиспользуемых пропсов много, то omit
По умолчанию пропсы разделяются так:
const { foo, bar, ...rest } = this.props;
даже если небольшая часть пропсов останется неиспользованной
но в крайних случаях lodash.omit подходит лучше