'ItemIsLoading'on指的是一種類型，但此處被用作值

Question

我正在為一個React項目構建一個打字稿的Redux存儲。 接口似乎運行良好，但是當我嘗試在導出本身中傳遞它們時。 我收到以下錯誤“'ItemIsLoading'指向類型，但在此處被用作值”

操作：

import * as constants from '../constants/constantsIndex';

    export interface ItemHasErrored {
        type: constants.ITEMS_HAS_ERRORED;
    }

    export interface ItemIsLoading {
        type: constants.ITEMS_IS_LOADING;
    }

    export interface ItemFetchDataSuccess {
        type: constants.ITEMS_FETCH_DATA_SUCCESS;
    }

    export function itemsFetchData(url: any) {
        return (dispatch) => {
            dispatch(ItemIsLoading(true));

            fetch(url)
                .then((response) => {
                    if (!response.ok) {
                        throw Error(response.statusText);
                    }

                    dispatch(ItemIsLoading(false));

                    return response;
                })
                .then((response) => response.json())
                .then((items) => dispatch(ItemFetchDataSuccess(items)))
                .catch(() => dispatch(ItemHasErrored(true)));
        };
    }

常量：

export const ITEMS_HAS_ERRORED = 'ITEMS_HAS_ERRORED';
export type ITEMS_HAS_ERRORED = typeof ITEMS_HAS_ERRORED;

export const ITEMS_IS_LOADING = 'ITEMS_IS_LOADING';
export type ITEMS_IS_LOADING = typeof ITEMS_IS_LOADING;

export const ITEMS_FETCH_DATA_SUCCESS = 'ITEMS_FETCH_DATA_SUCCESS';
export type ITEMS_FETCH_DATA_SUCCESS = typeof ITEMS_FETCH_DATA_SUCCESS;

目前，我僅嘗試構建typescript / redux存儲，但似乎找不到有關此問題性質的任何信息。 有人將如何解決該錯誤？

Answer 1

Typescript中的接口無法實例化，但是可以擴展。 因此，如果您希望使用與接口的類型簽名匹配的實例，則應該對其進行擴展。

您可以使用類來實現接口

class ItemIsLoadingAction implements ItemIsLoading {
  payload: boolean;
  constructor(payload) {
    this.payload = payload;
  }
}

然后，您可以使用它的實例來調度操作，例如

dispatch(new ItemIsLoadingAction(false))

這可以適用於其余接口。