I’ve built the following directive to transform an input’s v-model into uppercase:
app.directive('uppercase', (el) => {
el.value = el.value.toUpperCase()
})
But when I apply it, the resulting v-model returns the input value with the last character in lowercase.
<template>
<div>
<input type="text" v-uppercase v-model="testInput" />
<div>
{{ testInput }}
</div>
</div>
</template>
<script setup>
import { ref } from 'vue'
const testInput = ref('')
</script>
Why is this not working?