Машинопись: обработка параметра функции как буквального типа

Я пытаюсь написать 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>
      )
    }
  }
}

person Lionel Tay    schedule 03.11.2018    source источник


Ответы (1)


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

P extends { [P in K ]: C }

or

P extends Record<K, C>
person Titian Cernicova-Dragomir    schedule 03.11.2018