He creado un componente Vue 3 muy simple:
<template> <input type="text" :value="value" > </template> <script lang="ts"> import { defineComponent } from 'vue' export default defineComponent({ props:{ value: {type: String, default: ''} } }); </script>Con el siguiente HTML, estoy tratando de representar el componente en el navegador:
<div id="app"> {{message}} <my-input></my-input> </div> Esto funciona correctamente, pero falla cuando intento pasar el atributo de value a este componente:
<my-input :value="message"></my-input>Este es un error, me sale en la consola del navegador:
Uncaught DOMException: Failed to execute 'setAttribute' on 'Element': '0' is not a valid attribute name. at patchAttr (https://unpkg.com/vue@next:9333:18) at patchProp (https://unpkg.com/vue@next:9539:11) at mountElement (https://unpkg.com/vue@next:6051:27) at processElement (https://unpkg.com/vue@next:6024:15) at patch (https://unpkg.com/vue@next:5944:23) at ReactiveEffect.componentUpdateFn [as fn] (https://unpkg.com/vue@next:6484:23) at ReactiveEffect.run (https://unpkg.com/vue@next:580:31) at setupRenderEffect (https://unpkg.com/vue@next:6603:11) at mountComponent (https://unpkg.com/vue@next:6386:11) at processComponent (https://unpkg.com/vue@next:6344:19)Cualquier comentario por qué estoy recibiendo este error. Gracias por tu ayuda.