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

redux-toolket react-redux typescript 连接错误

如何解决redux-toolket react-redux typescript 连接错误

我通过 create-react-app test --template redux-typescript 创建我的项目,然后我通过连接而不是钩子重写 /src/features/counter/Counter.tsx,然后 vscode 给出这个错误

import React,{ Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { RootState,Appdispatch } from '../../app/store';
import {
  decrement,increment,incrementByAmount,incrementAsync,incrementIfOdd,} from './counterSlice';
import styles from './Counter.module.css';

const mapState = (state: RootState) => {
  return {
    count: state.counter.value
  }
}

const mapdispatch = (dispatch: Appdispatch) => {
  return {
    decrement: bindActionCreators(decrement,dispatch),increment: bindActionCreators(increment,incrementByAmount: bindActionCreators(incrementByAmount,incrementAsync: bindActionCreators(incrementAsync,incrementIfOdd: bindActionCreators(incrementIfOdd,}
}

type TypeofMapState = ReturnType<typeof mapState>;
type TypeofMapdispatch = ReturnType<typeof mapdispatch>;

type Ipros = TypeofMapState & TypeofMapdispatch;

class CounterComp extends Component<Ipros> {
  state = {
    incrementAmount: '2'
  }

  setIncrementAmount = (incrementAmount: string) => {
    this.setState({ incrementAmount });
  }

  render() {
    ...
  }
}

const Counter = connect<TypeofMapState,TypeofMapdispatch>(mapState,mapdispatch)(CounterComp);

export {
  Counter
}

enter image description here

我不知道怎么了,我只添加了带有 TypeofMapState 和 Typeofdispatch 的连接类型参数。

解决方法

使用

const Counter = connect<TypeofMapState,TypeofMapDispatch,{},RootState>(mapState,mapDispatch)(CounterComp);

解决这个错误

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