CharlesStover/reactn

Problem with super(props)

amfahrj opened this issue · 5 comments

I've just started using reactn, when I switch to using

import React, {Component} from 'reactn'

in all my classes where I have

class FooBar extends Component<FooProps, FooState> {
constructor(props: FooProps) {
super(props);

I'm getting the following for error for the call to super(props)

Expected 0 arguments, but got 1.

I'm using TypeScript 3.6.2.

Thank you for the report. What happens if you use React.Component instead of destructuring Component? This may be related to #89, where the Component on the namespace is not the same as the class itself.

No change. To be clear, I changed the import to

import React from 'reactn'

The class definition to

class FooBar extends React.Component<FooProps, FooState> {

and I continue to receive the same error (Expected 0 arguments, but got 1) for the call to super(props)

Just to simplify, I created a new project. I followed the default instructions on the typescript docs here

https://github.com/Microsoft/TypeScript-React-Starter#typescript-react-starter

I used the component version of Hello.tsx in those instructions.

In the Hello.tsx component I added

constructor(props: Props) {
super(props);
}

yarn build ran just fine.

Then, in the my-app directory I ran

npm install reactn

Finally, I modified the import statement in Hello.tsx to be

import * as React from 'reactn';

Failure at this point with

Expected 0 arguments, but got 1

on the call to super(props). This should make it easy to reproduce.

This is reproducible/confirmed, but I'm not sure the best way to solve it right now. I believe this is a result of the issue I mentioned before where TypeScript cannot correctly infer the definition of Component.

For a current workaround, I would hope // @ts-ignore above super(props) would solve your issue, and you would still get all the valid type checking as far as this.global, etc.

As far as solving this officially, my current plan is to handle this in a 3.0 release, where I do not intend to extend the React namespace. It should clear up a lot of the edge cases with TypeScript today.

If you are not coding in the constructor (as in it only contains super), I would leave the constructor off, as it will default to super(props) without error.

Let me know if // @ts-ignore solves your problem. Sorry for the inconvenience!

Thanks. // @ts-ignore is how I was already handling it. That is working for the moment.