Question

我是打字稿的新手。我在类型声明方面遇到了一些问题。

在reducer.ts 中，有一个State 类型，包括GoogleOauthType（包括状态、消息、数据、时间戳）和加载和错误。

但是，在googleOauthReducer中，ProfileObj和GoogleOauthType中存在没有状态、消息、数据和时间戳的错误。

我猜，原因是在 action.ts，我在那里声明了 googleOauthSuccess。

有没有人可以给我提示一下这个问题？

谢谢，，，

## types.ts
export interface GoogleOauthType {
  status: number;
  message: string;
  data: string;
  timestamp: number;
}

export type ProfileObj = {
  googleId: string;
  imageUrl: string;
  email: string;
  name: string;
  givenName: string;
  familyName: string;
};

## actions.ts
import { createAction, ActionType } from 'typesafe-actions';
import { createRequestActionTypes } from '@lib/createRequestSaga';
import { AxiosError } from 'axios';
import { GoogleOauthType, ProfileObj } from './types';

export const [GOOGLE_OAUTH_REQUEST, GOOGLE_OAUTH_SUCCESS, GOOGLE_OAUTH_FAILURE] =
  createRequestActionTypes('auth/GOOGLE_OAUTH');

export const googleOauth = createAction(GOOGLE_OAUTH_REQUEST)<ProfileObj>();
export const googleOauthSuccess = createAction(GOOGLE_OAUTH_SUCCESS)<GoogleOauthType>();

const actions = { googleOauth, googleOauthSuccess };
export type GoogleOauthActionTypes = ActionType<typeof actions>;

## reducer.ts
import { GOOGLE_OAUTH_SUCCESS, GoogleOauthActionTypes } from './actions';
import { GoogleOauthType } from './types';
import { AxiosError } from 'axios';
import { createReducer } from 'typesafe-actions';
import { GOOGLE_OAUTH_REQUEST } from '@typings/auth';

interface State extends GoogleOauthType {
  loading: boolean;
  error: AxiosError | null;
}

const initialState: State = {
  loading: false,
  status: 0,
  message: '',
  data: '',
  timestamp: 0,
  error: null,
};

const googleOauthReducer = createReducer<State, GoogleOauthActionTypes>(initialState, {
    [GOOGLE_OAUTH_REQUEST]: (state) => ({
        ...state,
        loading: false
    }),
  // error at below
  [GOOGLE_OAUTH_SUCCESS]: (state, { payload: { status, message, data, timestamp } }) => ({
      ...state,
      loading: true,
    status,
    message,
    data,
    timestamp,
  }),
});

带有 Redux 的 React js 中的打字稿

0 个答案: