Vue为什么说textarea标签不支持插值表达式的？

Question

演练场实测是可以的：

官方文档说不支持：

deepseek也说了不支持的原因：

可是实测不是能看到标签解析了插值表达式吗？并没有当字符串来显示。

Answer 1

OP你试一下我的这个Demo，在 input 和 textarea 里面都尝试输入一下。再看看绑定的值是不是会让 textarea 中的内容更新。

Vue SFC Playground

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

const msg = ref('Hello World!')
</script>

<template>
  <h1>msg: {{ msg }}</h1>
  <div>input:</div><input v-model="msg" />
  <div>textarea:</div><textarea>{{ msg }}</textarea>
</template>

其实AI回答里面已经解释了：

渲染结果会是纯文本 {{ message }}，而非动态数据。

说白了，就是 textareae 里面一开始渲染的是文本内容。如果外部修改了 msg 的值，那么 textarea 里面的内容会正常更新，就和 <div>{{ msg }}</div> 是一样的效果。

但是只要你在 textarea 里面做了输入，就会破坏一开始对于 msg 的绑定。那么其他业务再去修改 msg 变量的值的时候，textarea 中的内容就不会响应更新了。