Typescript: обработка параметра функции как литерального типа - PullRequest
0 голосов
/ 03 ноября 2018

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

Он работает путем рендеринга WrappedComponent в контексте Consumer и передает контекст как key prop, который предоставляется во время использования HOC.

Компонент работает нормально, и типы результирующего компонента корректны, но в реализации есть ошибка типа, поскольку K используется в качестве ключа, но в ключах машинописного текста должны быть литеральные типы. Есть ли способ обеспечить, чтобы универсальный тип был не только string, но и строковым литералом?

import React from "react"

function getConsumer<C>(
  Context: React.Context<C> | React.Consumer<C>,
): React.Consumer<C> {
  return (Context as any).Consumer || Context
}

export const withContext = <C extends any, K extends string>(
  Context: React.Context<C> | React.Consumer<C>,
  key: K,
) => <P extends { [K /* Error here, K must be a literal type */]: C }>(WrappedComponent: React.ComponentType<P>) => {
  type NewProps = Omit<P, K>

  return class WithContext extends React.Component<NewProps> {
    render() {
      const Consumer = getConsumer(Context)
      return (
        <Consumer>
          {context => (
            <WrappedComponent
              {...Object.assign({}, this.props, { [key || "context"]: context })}
            />
          )}
        </Consumer>
      )
    }
  }
}

1 Ответ

0 голосов
/ 03 ноября 2018

Нет способа принудительно установить, что K является литеральным типом, но вы можете использовать сопоставленный тип вместо типа с вычисляемым свойством

P extends { [P in K ]: C }

или

P extends Record<K, C>
...