Estoy creando una sección de comentarios de Vue en un blog de Laravel con Vue 3, Laravel y Bootstrap.

Tengo este método para almacenar comentarios en la tabla de comentarios (MySQL)

 <script> export default { props: ['userid', 'blogid'], data() { return { formData:{ comment:'', user_id: this.userid, blog_id: this.blogid, } } }, methods: { commentStore(){ axios.post('comment/store', this.formData).then((response)=> { console.log(response.data) }).catch((errors) =>{ console.log(errors) }); } } }

Debe ejecutarse al hacer clic en el elemento commentStore, como se ve a continuación:

 <template> <div class="row"> <div class="col-xl-12"> <div class="comment-form__input-box"> <textarea name="comment" v-model="formData.comment" placeholder="Your message here" rows="2"></textarea> </div> <button type="submit" class="thm-btn comment-form__btn" @click.native="commentStore">submit comment</button> </div> </div>

El problema

Al hacer clic, el elemento aún ejecuta un método anterior que eliminé.

 <script> export default { props: ['userid', 'blogid'], data() { return { formData:{ comment:'', user_id: this.userid, blog_id: this.blogid, } } }, methods: { commentStore(){ alert(this.userid) } } }

Pregunta

1. ¿Cómo borro Vue Js Cache?

2. Si no es el caché, ¿por qué no se ejecuta el método actual?

Yo he tratado

1. borrando la memoria caché de los navegadores

2. realizar una optimización artesanal de PHP en CLI

Sin cambios, gracias por el Assit.