vuejs-challenges
vuejs-challenges copied to clipboard
26 - 实现简易版`v-model`指令
<script setup lang='ts'>
import { ref } from "vue"
/**
* Implement a custom directive
* Create a two-way binding on a form input element
*
*/
const VOhModel = {
mounted(el, binding){
el.value = binding.value
el.addEventListener('input', (ev) => {
value.value = ev.target.value
})
}
}
const value = ref("Hello Vue.js")
</script>
<template>
<input v-oh-model="value" type="text" />
<p>{{ value }}</p>
</template>