2016-11-24 268 views
4

我是新來的TypeScript和Visual Studio代碼。 我收到以下錯誤:類型'Actions'上不存在屬性'payload'

*[ts] Property 'payload' does not exist on type 'Actions'.

我的代碼:

action.ts文件:

import { Action } from '@ngrx/store'; 
    import { Item } from '../models/list'; 

    export class AddBookAction implements Action { 
     type = ActionTypes.ADD_BOOK; 

     constructor(public payload: Item) { } 
    } 

    export type Actions = AddBookAction; 

reducer.ts

import * as list from 'action'; 

export function reducer(state = initialState, action: list.Actions): State { 

switch (action.type) { 
    case list.ActionTypes.LOAD: { 
     return Object.assign({}, state, { 
     loading: true 
     }); 
    } 

    case list.ActionTypes.LOAD_SUCCESS: { 
     const books = action.payload // Error here 

     return { 
     loaded: true, 
     loading: false, 
     ids: books.map(book => book.id) 
     }; 
    } 
} 

任何意見會很有幫助。

+0

什麼打字稿版本您使用的?只是VSCode拋出這個錯誤,或者是Typescript編譯器也抱怨? – olsn

+1

我得到相同的錯誤...我使用打字稿版本2.0.3 – Daskus

+0

我沒有看到錯誤,我正在使用TypeScript 2.0.10。 – cartant

回答

2

你張貼看起來是不完整的,因爲在reducer.ts您使用list.ActionTypes.LOAD_SUCCESS的代碼,但是這不是action.ts你貼的一部分。

所以一個猜測可能是,在你的LoadSuccessAction中,你錯過了​​-attirbute - 例如, public payload: Item

另一種猜測是,你忘了工會在LoadSuccess型:

export type Actions = AddBookAction | LoadSuccessAction; 
+0

我在某些操作中丟失了有效內容項,這解決了錯誤,但有效內容未輸入。使用'action:list.Actions'的好處是'action:Action'嗎?如果在兩種情況下都沒有輸入有效載荷,我看不到任何意義... – Daskus

+1

優點是,使用'list.Actions',您可以定義一組被您的reducer接受的動作,使您能夠檢測類型不匹配的錯誤(或類似於你的錯誤)在編譯時而不是在運行時(這將是'action:Action'的情況) - 請參閱這裏瞭解更多技術細節:https://www.typescriptlang.org/ docs/handbook/advanced-types.html#歧視工會 – olsn

+0

我不明白。在某些/大多數情況下,減速器也希望對其他減速器的動作做出反應以改變其狀態,或者有時動作不需要有效載荷。通過這種方式,我需要爲每個Action提供一個有效載荷(這在我看來會是開銷)+我無法訪問其他reducer動作...如果有效載荷本身會被鍵入,它會有意義,因爲您可以看到每個屬性該動作的有效載荷在編譯時/編譯時已經存在。 – Daskus

相關問題