score:0
after some trouble i was able to get this to work!
// assuming all these interfaces are well defined somewhere.
type mycomponentprops = ownprops & composeprops & stateprops & dispatchprops;
// the secret sauce, need to define a class constructor to pass to compose
interface mycomponentclass<mycomponentprops> extends react.componentclass {
new (props: mycomponentprops): react.component<mycomponentprops>;
}
export class mycomponent extends react.component<mycomponentprops> {
...
}
export default compose<mycomponentclass<mycomponentprops>>(
withsomehoc(),
connect<stateprops, dispatchprops, ownprops>(mapstatetoprops, mapdispatchtoprops)
)(mycomponent);
the above will allow you to import the composed component and maintain type safety!
score:2
i do it this way:
import { compose } from 'redux';
then:
export default compose<react.componentclass>(
withrouter,
connect<imapstatetoprops, imapdispatchtoprops, iconnectedrouterprops>(
mapstatetoprops,
{
fetchcomponentdata
},
),
)(component);
Source: stackoverflow.com
Related Query
- Using React forwardRef with Redux connect
- Connecting a component with OwnProps using react redux and typescript in the .NET Core 2.0 reactredux template project
- React Redux connect is not assignable to type '() => void' with typescript
- How do i prevent circular type reference in typescript with redux and connect when using mapState function?
- Using React Redux Toolkit with Typescript - set state for reducer
- Is there a way to cache data coming from redux connect in React function component with using useRef()?
- Using redux connect with React hooks
- React HOC TypeScript get rid of any type with Redux connect
- Using state in react with TypeScript
- React with Typescript -- Generics while using React.forwardRef
- Prevent react component from rendering twice when using redux with componentWillMount
- Using React forwardRef with Typescript generic JSX arguments
- How to use forwardRef with FunctionComponent in React Native using TypeScript
- Using react redux with next.js
- Using ES6 Map with React and/or Redux
- Something went wrong with react table using typescript
- How to use jest.spyOn with React function component using Typescript
- Using react context with react hooks in typescript
- TypeScript errors when using Redux-Form with React-Redux connect
- Typing redux forms v7 with TypeScript and React
- Using Redux Form with React Router
- can i use the tsx extension for test files if using react with typescript
- React redux connect with with styles and withrouter
- this.props.yyy is undefined while using react with typescript but working properly in es5?
- using react with redux and Getting error in redux '=' expected
- Is it possible to type a React function component with TypeScript without using arrow functions?
- How to connect each element of array individually by using react redux
- React lazy with TypeScript and Redux
- React observable epic with Redux Toolkit and Typescript
- Jest test for a copy to clipboard method using react with typescript
More Query from same tag
- Passing data to other component
- How to load data "on-demand" in Redux/React app
- TypeScript + React: Trying to write a component that accepts two types of props but I end up only being able to access the common prop
- React View source in Browser Newbe React
- using postMessage in a modal to communicate the parent window
- Adding a link to an image path
- Adding a linear gradient to Material UI icon
- How to apply css only to React child component
- React Form Not Fetching From Express Server
- React useState hook and submit in multi step form
- Border Bottom makes Material UI icons smaller when hovered
- React toggle className on button click
- React array did not update despite using useEffect
- How do I get inputRef to return <input> element from <Textfield>? Tried everything I can think of and it's still null
- Measure height of a element in semantic react ui
- react-chartjs pie chart not rendering
- VS Code: how to add all default snippet of HTML files into react js files?
- How to call function that uses hooks in typescript?
- Setting State From props Values To Make An UPDATE Request
- react redux with axios api calls
- Sorting array of objects using name propery which contains alphabet and numbers using
- How can I watch for state of data in redux container, when I want to sort or filter it?
- JSX return a html segment
- Typescript useState: SetState in Child with argument
- How to use Microdata in React+Typescript?
- React read input values from multiple input text fields
- solving error unauthorized /rest-auth/registration/ in django allauth
- How to set the path to the file in the project?
- Typescript + React useReducer hook error: Data object not assignable to parameter of type 'never'
- React - translations per component