源码如下:
div设置了contenteditable属性,但是其中的通过ref绑定的数据监听不到变化
<script setup>
import {onMounted, ref,watch} from "vue"
let textbox = ref('')
onMounted(()=>{
let content = ref(textbox.value.innerText)
console.log(content) //打印还是一个数据代理而不是值
console.log(textbox.value.innerText) //打印的却是一个值
// 监视不到数据的改变
watch(content,(newValue,oldValue)=>{
console.log(newValue,oldValue)
})
})
</script>
<template>
<div class="bbox">
<div id="box" ref="textbox" contenteditable >出现问题</div>
</div>
</template>
输出打印如下:
向div中输入数据时,理论上content的内容应该改变了,但是watch监听不到,没有输出任何内容
该如何解答??有什么方法可以监听到其中的数据变化吗??