const变量作为类型-打字稿

debugcn 发表于 Dev

sqtr

在学习Typescript的过程中，我遇到一个常数变量，该常数用于操作reducer的作用值（创建它是为了防止输入错误-我读过这是一种好习惯）。

const INPUT_CHANGE: string = "INPUT_CHANGE";
const INPUT_BLUR: string = "INPUT_BLUR";

我还创建了用于定义减速器动作的类型：

type InputReducerAction =
  | { type: INPUT_CHANGE; value: string; isValid: boolean }
  | { type: INPUT_BLUR };

这是我的减速器：

const inputReducer = (state: InputReducerState, action: InputReducerAction) => {
  switch (action.type) {
    case INPUT_CHANGE:
      return {
        ...state,
        value: action.value,
        isValid: action.isValid,
      };
    case INPUT_BLUR:
      return {
        ...state,
        touched: true,
      };
    default:
      return state;
  }
};

当我有everythink像上面INPUT_CHANGE并INPUT_BLUR在InputReducerAction标记为错误：

'INPUT_CHANGE'引用一个值，但是在这里被用作类型。ts（2749）你的意思是'typeof INPUT_CHANGE'吗？

'INPUT_BLUR'引用一个值，但是在这里被用作类型。您是说'typeof INPUT_BLUR'吗？ts（2749）

当我对这个常数使用双引号时，问题消失了，就像这样

type InputReducerAction =
  | { type: "INPUT_CHANGE"; value: string; isValid: boolean }
  | { type: "INPUT_BLUR" };

但是我的const变量现在没有用了。我做错了什么或错过了什么？

在写这个问题时，我有了使用枚举的想法：

enum INPUT_ACTION {
  INPUT_CHANGE = "INPUT_CHANGE",
  INPUT_BLUR = "INPUT_BLUR"
}

type InputReducerAction =
  | { type: INPUT_ACTION.INPUT_CHANGE; value: string; isValid: boolean }
  | { type: INPUT_ACTION.INPUT_BLUR };

const inputReducer = (state: InputReducerState, action: InputReducerAction) => {
  switch (action.type) {
    case INPUT_ACTION.INPUT_CHANGE:
      return {
        ...state,
        value: action.value,
        isValid: action.isValid,
      };
    case INPUT_ACTION.INPUT_BLUR:
      return {
        ...state,
        touched: true,
      };
    default:
      return state;
  }
};

并在减速器和类型中使用它。错误消失但是这是个好主意还是我可以用更好的方法做到这一点

Thgaskell

您可以在v3.4之后使用const断言来执行您要描述的事情。

const INPUT_CHANGE = "INPUT_CHANGE" as const;
const INPUT_BLUR = "INPUT_BLUR" as const;

type InputReducerAction =
  | { type: typeof INPUT_CHANGE; value: string; isValid: boolean }
  | { type: typeof INPUT_BLUR };

const changeAction: InputReducerAction = {
  type: INPUT_CHANGE, value: '', isValid: false
};

const blurAction: InputReducerAction = {
  type: INPUT_BLUR
};

问题在于，仅在运行时分配JavaScript变量的值，而TypeScript需要在编译时知道它。使用const断言是一种通知打字稿其值不应更改的方法。当您获取typeof变量时，请使用文字值，而不是string通常分配给该变量的通用类型。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。