以下のような単純なコードを書きました
- one.tsx
typescript
1import * as React from 'react'; 2import { connect, DispatchProp } from 'react-redux'; 3import { State } from '../reducers'; 4interface AppProps extends React.Props<State> { 5 test: string; 6} 7 8const mapStateToProps = (state: State, ownProps: AppProps): AppProps => ({ 9 test: state.test, 10 ...ownProps 11}); 12 13const App = (props: AppProps & DispatchProp<{}>) => { 14 props.dispatch({ type: 'test' }); 15 return (<h1> App test </h1>); 16}; 17export default connect(mapStateToProps)(App); 18
- reducers/index.ts
typescript
1import { combineReducers } from 'redux'; 2 3function test(state: string = 'test', action: {}) { 4 return state; 5} 6export interface State { 7 test: string; 8} 9export default combineReducers({ 10 test 11});
上記 One コンポーネントを使おうとすると以下のようなエラーメッセージが出てしまいます。
error TS2322: Type '{}' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<AppProps, ComponentState>> & Readonly<{ ...'. Type '{}' is not assignable to type 'Readonly<AppProps>'. Property 'test' is missing in type '{}'.
どうすればいいのか教えてください
開発環境は
create-react-app --scripts-version=react-scripts-ts
を用いて構築しております。
"@types/jest": "^20.0.2", "@types/node": "^8.0.7", "@types/react": "^15.0.34", "@types/react-dom": "^15.5.1", "react": "^15.6.1", "react-dom": "^15.6.1", "react-redux": "^5.0.5", "@types/react-redux": "^4.4.45", "@types/redux": "^3.6.0",
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。