【问题标题】:redux-toolket react-redux typescript connect errorredux-toolkit react-redux typescript 连接错误
【发布时间】:2021-04-26 08:19:34
【问题描述】:

我通过create-react-app test --template redux-typescript创建我的项目,然后我通过connect而不是钩子重写/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, dispatch),
    incrementByAmount: bindActionCreators(incrementByAmount, dispatch),
    incrementAsync: bindActionCreators(incrementAsync, dispatch),
    incrementIfOdd: bindActionCreators(incrementIfOdd, dispatch),
  }
}

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
}

不知道哪里出了问题,我只添加了TypeofMapState和TypeofDispatch的连接类型参数。

【问题讨论】:

    标签: typescript react-redux connect redux-toolkit


    【解决方案1】:

    使用

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

    解决这个错误

    【讨论】:

      猜你喜欢
      • 2018-03-19
      • 2017-06-08
      • 2018-03-10
      • 2021-09-21
      • 2021-08-23
      • 2022-07-16
      • 1970-01-01
      • 1970-01-01
      • 2021-05-24
      相关资源
      最近更新 更多