微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

TypeScript Redux Action 创建函数返回类型

如何解决TypeScript Redux Action 创建函数返回类型

使用 FSA 规则创建动作函数

未指定返回类型,eslint中显示warning。

想在不修改eslint规则的情况下解决问题

是否有一种简单的方法来指定除任何类型之外的类型?

github source code

const ADD_Todo = 'todos/ADD_Todo' as const;
const TOGGLE_Todo = 'todos/TOGGLE_Todo' as const;
const REMOVE_Todo = 'todos/REMOVE_Todo' as const;

// Missing return type on function!!!?
export const addTodo = (text: string) => ({
  type: ADD_Todo,payload: text,});

// Missing return type on function!!!?
export const toggletodo = (id: number) => ({
  type: TOGGLE_Todo,payload: id,});

// Missing return type on function!!!?
export const removetodo = (id: number) => ({
  type: REMOVE_Todo,});

type TodosAction = ReturnType<typeof addTodo> | ReturnType<typeof toggletodo> | ReturnType<typeof removetodo>;

export type Todo = {
  id: number;
  text: string;
  done: boolean;
};

export type Todosstate = Todo[];

const initialState: Todosstate = [
  { id: 1,text: 'Hi',done: true },{ id: 2,text: 'Every',{ id: 3,text: 'one',done: false },];

function todos(state: Todosstate = initialState,action: TodosAction): Todosstate {
  switch (action.type) {
    case ADD_Todo: {
      const nextId = Math.max(...state.map((todo) => todo.id)) + 1;
      return state.concat({
        id: nextId,text: action.payload,done: false,});
    }
    case TOGGLE_Todo:
      return state.map((todo) => (todo.id === action.payload ? { ...todo,done: !todo.done } : todo));
    case REMOVE_Todo:
      return state.filter((todo) => todo.id !== action.payload);
    default:
      return state;
  }
}

export default todos;

解决方法

你能写一个泛型吗?像这样:

type ActionCreate<TP> = (p: TP) => { type: string,payload: TP };

const addTodo: ActionCreate<string> = (v) => ({
  type: 'ADD',payload: v
})

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。