Estoy tratando de hacer un componente con vanilla js + mecanografiado
Hice la clase "Componente". el problema es "estado"
interface boardState { items: string[]; page: number; } interface postState { writer: string; content: string; } class Component { $target : Element; state: boardState | postState; constructor() { ...} init() { ...} setState() { ...} render() { ...} } class Board extends Component{ constructor(selector) { super(selector); } init(){ this.state.items = ["title1", "title2"] ; // error } }y esta es la clase "Tablero" extiende el Componente.
Quiero usar diferentes tipos de estado. ej.) estado del tablero, estado de la publicación, estado de la página
pero cuando uso state.items en Board, ocurrió el error.
mensaje de error: TS2339: la propiedad 'elementos' no existe en el tipo 'postState | tableroEstado'.
¿Cómo puedo arreglarlo?
¿Puedes cambiar el tipo en la clase Board ?
p.ej
interface boardState { items: string[]; page: number; } interface postState { writer: string; content: string; } class Component { $target : Element; state: boardState | postState; } class Board extends Component{ state: boardState; constructor() { super(); } init(){ this.state.items = ["title1", "title2"] ; } }state puede ser boardState o postState , no ambos
En el caso de que sea postState e intente establecer el valor de state.items , no funcionará, por lo que TypeScript arroja un error.
eso es porque solo tiene items en boardState , lo que necesita es type narrowing y administrar el caso donde los elementos no existen, en la documentación de TS puede ver más sobre eso https://www.typescriptlang.org/docs/handbook /2/estrechamiento.html
pero en su caso, creo que es mejor agregar el miembro en la clase Junta