Búsqueda de sitios web

reactjs - ¿Cómo establecer el estado inicial de React en TypeScript?


¿Cuál es la manera correcta de inicializar el estado al usar TypeScript y React? Lo siguiente genera un error porque, obviamente, currentVehicle no puede ser un objeto vacío. ¿Cuál debería ser el estado inicial? ¿Cuáles son las mejores prácticas?

 interface State{
    currentVehicle:Vehicle
}

export default class extends Component<Props, State> {
   state:State={
       currentVehicle:{}
     }
  }

Respuesta #1

Puedes lanzarlo:

state:State = {
    currentVehicle:{} as Vehicle
}

Respuesta #2

En este caso, definiría el tipo de currentVehicle como Vehicle o null y le asignaría un valor nulo en el estado inicial

interface State {
   currentVehicle: Vehicle | null
}

export default class extends Component<Props, State> {
  state: State = {
     currentVehicle: null
  }
}

Una segunda opción sería definir currentVehicle como un parámetro opcional. De esa manera no tienes que inicializarlo.

interface State {
   currentVehicle?: Vehicle // optional
}

export default class extends Component<Props, State> {

  /** you only define your state without defining state.currentVehicle */
  state: State = {}
}

Artículos relacionados