-
-
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 подходит лучше