Question

我正在尝试在angular6中使用ngrx。我是ngrx的新手。我关注了一些网站并实施了该网站，但出现错误：reducer页面中未定义的类型。即使是小错误，也请帮忙。谢谢

我在Google中搜索过，但没有一个适合我。

我的减速机页面：


import { Action } from '@ngrx/store';
import { login } from '../../interface/login';
import *  as loginInstance from '../actions/login.actions';

 const initialState :login={
    username:'',
    password:''
};

export function getLoginInput(action:loginInstance.loginAction, loginValueClassObj:loginInstance.LoginValueClass, state:login = initialState){
    switch(action.type){
        case loginInstance.LOGIN_VALUE:
        {
            console.log("login user credentials ", loginValueClassObj, "");
            // loginUserCredential.username = loginValueClassObj.type;
              return loginValueClassObj;
        }
         default:
          return state;
    }

}

和我的操作页面：

import { Action } from '@ngrx/store';
import { login } from '../../interface/login'

export const LOGIN_VALUE = 'LoginValue'   


export class LoginValueClass implements Action{
    constructor(public payload?:login){}
    readonly type = LOGIN_VALUE;
}
export type loginAction =  LoginValueClass;

和package.json文件：

"dependencies": {
    "@angular/animations": "^6.1.2",
    "@angular/cdk": "^6.4.5",
    "@angular/common": "^6.1.0",
    "@angular/compiler": "^6.1.0",
    "@angular/core": "^6.1.0",
    "@angular/forms": "^6.1.0",
    "@angular/http": "^6.1.0",
    "@angular/material": "^6.4.5",
    "@angular/platform-browser": "^6.1.0",
    "@angular/platform-browser-dynamic": "^6.1.0",
    "@angular/router": "^6.1.0",
    "@ngrx/store": "^6.1.0",
    "core-js": "^2.5.4",
    "rxjs": "^6.0.0",
    "zone.js": "~0.8.26"
  },

Answer 1

您应该这样定义减速器：

export function getLoginInput(state:login = initialState, action:loginInstance.loginAction) {
    switch(action.type){
        case loginInstance.LOGIN_VALUE:
        {
            console.log("login user credentials ", state, "");
            //update your state here and return a new state as per your app logic
            //I am returning the same state just for this example
            return state;
        }
         default:
          return state;
    }

}

查看有效的堆叠闪电-https://stackblitz.com/edit/angular-cw836m?file=src/app/store/reducers/login.reducer.ts

请参阅ngrx官方文档-https://github.com/ngrx/platform/blob/master/docs/store/actions.md#action-reducers

TypeError：无法读取未定义的属性“类型”

1 个答案: