Question

所以我是使用redux的新手，并且一直在尝试创建一个简单的计数器应用程序，只需单击按钮就可以增加，但我收到了此错误信息：

node_modules/@angular-redux/store/lib/src/components/ng-redux.d.ts(10,31）中的错误：错误TS2420：类'NgRedux'错误地实现了接口'ObservableStore'。财产'派遣'的类型是不相容的。类型'Dispatch'不能分配给'Dispatch'类型。类型'RootState'不能分配给'AnyAction'类型。 node_modules/@angular-redux/store/lib/src/components/ng-redux.d.ts(37,33）：错误TS2344：类型'RootState'不满足约束'Action'。 node_modules/@angular-redux/store/lib/src/components/root-store.d.ts(18,24）：错误TS2344：类型'RootState'不满足约束'Action'。 src / app / app.component.ts（20,29）：error TS2345：类型'{type：string; }'不能赋值给'IAppState'类型的参数。对象文字只能指定已知属性，'IAppState'类型中不存在'type'。

这是我的app.components.ts文件 `

import { Component } from '@angular/core';
import { NgRedux, select } from '@angular-redux/store';
import { IAppState } from './store';
import { INCREMENT } from './actions';
import { Observable } from 'rxjs';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
  counter = 0;
  constructor(
    public ngRedux: NgRedux<IAppState>
  ){

  }
  increment(){
    this.ngRedux.dispatch({ type: INCREMENT });
    //This is specifically where I get the error. type: INCREMENT is underlined with a red squiggly line
}
}
`

这是我的store.ts文件：

    import { INCREMENT } from './actions';

export interface IAppState {
counter: number;
}
export function rootReducer(state: IAppState, action): IAppState{
switch (action.type){
    case INCREMENT: return { counter: state.counter + 1 };
}
    return state;
}

这是我的app.module.ts文件：

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { NgRedux, NgReduxModule } from '@angular-redux/store';


import { AppComponent } from './app.component';
import { IAppState, rootReducer } from './store';


@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    NgReduxModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { 

  constructor(private ngRedux: NgRedux<IAppState>){
      this.ngRedux.configureStore(rootReducer, { counter: 0 });
  }
}

Answer 1

在package.json中使用以下版本的Redux，所有版本都可以使用：

"redux": "^3.6.0"

您可能正在使用"redux": "^4.0.0"。在此版本中，Dispatch接口的定义已更改。从（^ 3.6.0）：

export interface Dispatch<S> {
    <A extends Action>(action: A): A;
}

到（^ 4.0.0）：

export interface Dispatch<A extends Action = AnyAction> {
  <T extends A>(action: T): T;
}

"@angular-redux/store": "^7.1.1"包尚不支持"redux": "^4.0.0"。如果您希望使用"redux": "^4.0.0"，请在以下文件中编辑dispatch的定义：

<强> node_modules/@angular-redux/store/lib/src/components/ng-redux.d.ts

<强> node_modules/@angular-redux/store/lib/src/components/root-store.d.ts

调度重新定义：

abstract dispatch: Dispatch<RootState>;

到

abstract dispatch: Dispatch;

Answer 2

标记答案和以下链接的组合解决了我的所有问题：https://github.com/angular-redux/store/pull/522

this.ngRedux.dispatch无法正常工作

2 个答案: