TypeScript错误类型“ {}”缺少类型中的以下属性

时间:2020-09-18 10:07:17

标签: reactjs typescript redux types

我通常是TypeScript的新手,并且收到此错误。

类型'{}'缺少类型'Pick ':loadUser,用户

上面的错误出现在App.text中,并指向<AppRouter/>

我很困惑为什么要得到这个,可能的解决方法是什么?我以为我没有在应用路由器内部正确声明某些内容,但似乎无法弄清楚是什么错误或收到的错误?

App.tsx

import AppRouter from './router/AppRouter'

const App: React.FC = () => {
  return (
    <Fragment>
      <AppRouter />
    </Fragment>
  )
}

export default App

应用路由器


import React, {ExoticComponent, Fragment, useEffect} from 'react'
import {BrowserRouter as Router, Switch, Route} from 'react-router-dom'
import FreeTextView from '../components/analytics/dashboard/freeTextView/FreeTextView'
import {connect, useDispatch, useSelector} from 'react-redux'
import {Nav, IconSvgs} from '@pxhub/shared-components'
import {AppState, UserI, AccessRecordsI} from '../store/actions/Types'
import {loadUser} from '../store/actions/UserActions'

interface PropsI {
  loadUser: () => void
  user: UserI
}

// Defualt Page
const Page = () => {
  return (
    <Fragment>
      <Switch>
        <Route path="/freeview" component={FreeTextView} />
      </Switch>
    </Fragment>
  )
}

// App Router
export const AppRouter: React.FC<PropsI> = ({loadUser, user}: PropsI) => {
  const userAccess = user.accessRecords.map((accessRecord: AccessRecordsI) => {
    return accessRecord.Access_Transaction
  })

  useEffect(() => {
    loadUser()
  })

  return (
    <Fragment>
      <IconSvgs />
      <Nav
        user={user}
        userAccess={userAccess}
        urlPrefix={process.env.REACT_APP_URL_PREFIX}
      />
      <Router>
        <Switch>
          <Route path="/" component={Page} />
        </Switch>
      </Router>
    </Fragment>
  )
}

const dispatch = useDispatch()

const mapDispatchToProps = () => () => {
  dispatch(loadUser())
}
const mapStateToProps = useSelector((state: AppState) => state.user)

export default connect(mapStateToProps, mapDispatchToProps)(AppRouter)

2 个答案:

答案 0 :(得分:1)

您宣布AppRouter要求道具loaduser和user,但随后在App.tsx中调用了这些道具而没有这些道具。

答案 1 :(得分:0)

我不确定mapDispatchToProps语法。

不是这样吗?

const mapDispatchToProps = () => {
  dispatch(loadUser())
}