Búsqueda de sitios web

reactjs - Error de Typescript: TS2604 - ¿Cómo solucionarlo?

Estoy intentando usar una biblioteca llamada redux-form en un proyecto basado en Typescript. Cuando tomo su código de ejemplo de "formulario simple" y lo implemento, obtengo un error:

error TS2604: JSX element type 'SimpleForm' does not have any construct or call signatures.

¿Qué estoy haciendo mal? Tengo el archivo de definición para esta librería instalado, así que o lo he codificado incorrectamente o el archivo de definición es incorrecto.

En mi componente de formulario (reduje el código al mínimo para hacerlo lo más ligero posible):

import * as React from 'react';
import {reduxForm} from 'redux-form';
export const fields = ['firstName'];

class SimpleForm extends React.Component<any, any> {

  static propTypes = {
    fields: React.PropTypes.object.isRequired,
  };

  render() {
    const {
      fields: {firstName}
      } = this.props;
    return (<form>
        <div>
          <label>First Name</label>
          <div>
            <input type="text" placeholder="First Name" {...firstName}/>
          </div>
        </div>

        <div>
          <button>
            Submit
          </button>
        </div>
      </form>
    );
  }
}

export default reduxForm({
  form: 'simple',
  fields
})(SimpleForm);

y lo consumo aquí (lo que resulta en el error mencionado):

import * as React from 'react';
import * as ReactDOM from 'react-dom';
import * as SimpleForm from '../components/GuestForm';

export default class Main extends React.Component<any, any> {
     render() {
        return (
        <div className='mainApp'>
            <SimpleForm />
        </div>
        );
    }
}

Respuesta #1

Creo que tu problema está en cómo importas una clase exportada por defecto:

export default reduxForm(...

Si lo tienes declarado como arriba, entonces deberías importarlo así:

import SimpleForm from '../components/GuestForm'

De lo contrario, puedes eliminar 'default' e importarlo así:

import {SimpleForm} from '../components/GuestForm'

Espero que esto ayude.

Respuesta #2

No puedo comentar sobre la respuesta anterior (de Amid), porque no tengo suficiente reputación en StackOverflow, pero su respuesta es correcta.

Tuve el mismo problema: *** (82,14): error TS2604: El tipo de elemento JSX 'SlideForm' no tiene ninguna firma de llamada de constructor.***

Aquí está mi código anterior:

export default class SliderForm extends React.Component<any, any> {...};

con la forma anterior de importar la clase :

import * from SlideForm from '../../common/SliderForm';

Esto me lleva al mismo problema que el tuyo.

Así que cambié la forma en que estoy haciendo la importación a esto:

import SlideForm from '../../common/SliderForm';

Y resolvió mi problema.

Artículos relacionados