Saya tidak faham mengapa apabila saya menghantar fungsi tanpa nama ke medan @input komponen input html saya ia berfungsi, tetapi apabila saya memanggil fungsi sebenar dengan kod yang sama di dalamnya ia tidak berfungsi. Ini ialah kod apabila ia tidak berfungsi:

<script setup>
import { ref } from 'vue'

const text = ref('')
const numberChar = ref(0)
const numberWords = ref(0)

function count() {
    numberChar = text.length
    numberWords = text.split(' ').filter((e) => e != '').length
}

</script>

<template>

<div class="box">
<input v-model="text" placeholder="Write here" @input="count"/>
 <p>
     Text : {{text}} <br>
     Characters : {{numberChar}} <br>
     Words : {{numberWords}}
 </p>
</div>

</template>

Tetapi apabila saya hanya berkata:

<input v-model="text" placeholder="Write here" @input="() => numberChar = text.length"/>

nilainumberChar telah diubah suai dan dipaparkan dengan betul. Saya memulakan Vuejs jadi saya kehilangan sesuatu, tetapi saya telah bergelut dengan ini selama sejam...