Estoy usando VueJs (procedente de React, así que soy nuevo), y tengo esta entrada que contiene un código => combinaciones de vocales y números. Tengo 2 problemas, primero que nada.
No estoy seguro de cuál es el tipo correcto para la entrada y, en segunda instancia, mi var definido como número | la cadena arroja un error.
Sé que podría ser un tipo de problema estúpido, pero soy nuevo con Vue y TypeScript, por lo que sería muy útil si pudiera decirme la forma correcta de hacerlo.
Aquí está el código:
<template> <form> <label>Code</label> <input type="text" placeholder="enter a code using only vowels and numbers" required maxlength="15" minlength="7" v-model="codeValue" <!-- Error here --> @blur="handleFocus" /> <span v-if="focused">You should only enter vowels and numbers.</span> </form> </template> <script lang="ts"> import {defineComponent} from 'vue' export default defineComponent({ name: 'InputValidations', data() { return { emailValue: '' as string, selectedNumber:0 as number, codeValue: '' as string | number, focused: false as boolean } } }) </script>El error proviene de v-model="codeValue" y dice:
Argument of type 'string | number' is not assignable to parameter of type 'string | null | undefined'. Type 'number' is not assignable to type 'string'.VueDX/TS(2345)Creo que el problema es que estás usando VueDX, que he notado que no funciona del todo bien.
Cambie a Volar , la extensión de VS Code recomendada oficialmente, especialmente para la compatibilidad con TypeScript. Instale también el complemento TypeScript Vue para Volar .