Any idea what could cause that it ruins the first character | TypeScript Community | Page 1

<template>
  <input
    :value="value"
    type="text"
    :placeholder="placeholder"
    :disabled="disabled"
    autocomplete="off"
    autocorrect="off"
    autocapitalize="off"
    spellcheck="false"
    class="flex-1 bg-panel border border-borderMuted rounded-md px-3 py-2 text-base outline-none text-deepText placeholder-subtleText focus:border-accent transition-colors"
    @input="handleInput"
    @compositionstart="handleCompositionStart"
    @compositionend="handleCompositionEnd"
  />
</template>

<script setup lang="ts">
import { ref } from 'vue';

defineProps({
  placeholder: {
    type: String,
    default: ''
  },
  value: {
    type: String,
    default: ''
  },
  disabled: {
    type: Boolean,
    default: false
  }
});

const emit = defineEmits(['update:value', 'input', 'keydown']);

const isComposing = ref(false);

function handleCompositionStart(event: CompositionEvent) {
  isComposing.value = true
  const target = event.target as HTMLInputElement;
  emit('update:value', target.value);
  emit('input', target.value);
}

function handleCompositionEnd(event: CompositionEvent) {
  isComposing.value = false
  const target = event.target as HTMLInputElement;
  emit('update:value', target.value);
  emit('input', target.value);
}

function handleInput(event: Event) {
  const target = event.target as HTMLInputElement;
  emit('update:value', target.value);
  emit('input', target.value);
}
</script>

Any idea what could cause that it ruins the first character
Like only visually
I entered ` but it shows '
I use Vue

#Any idea what could cause that it ruins the first character