使用ts 规定redux中不同action的提交类型

先看上一篇文章：在redux里使用ts能全局提示
对上一次的项目进行改造：
新建一个：interface>index.ts

ts推导方程：

type TranslateType<T> = {
    [K in keyof T]: {
        type: K
        payload: T[K]
    }
} [keyof T]

export type{
    TranslateType
}

newsData：

//上一篇的这里action已经可以去掉了，上一篇action有两个这里省略点写删了一个
// import {CHANGE_NEWS_DATA} from "./action"
import {TranslateType} from "@/interface";

//定义好一个map，左边还是原来的action，右边是类型
type payloadMap = { 'change_news_data': { news: { title: string } } }

//上一篇的类型定义可以不要了
// type payloadType = { type: string, payload: newsData }

//store初始化数据类型定义
type newsData = {news: { title: string }}

//store数据初始化的数据类型
let init: newsData = {
    news: {title: "1111"}
}

//使用鼠标浮上去按住ctrl可以查看当前的推导类型
type a = TranslateType<payloadMap>

const reducer = (dataInit = init, data: TranslateType<payloadMap>): newsData => {
    switch (data.type) {
        case 'change_news_data':
            return {...dataInit, news: data.payload.news}
        default:
            return {...dataInit}
    }
}
export default reducer

在login里查看类型推导

dispatch也能推出来，而且每一个action 都有对应的提交类型