vue textarea在表单中的使用

最新推荐文章于 2025-09-30 08:49:24 发布

原创最新推荐文章于 2025-09-30 08:49:24 发布 · 2.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue #textarea

前端专栏收录该内容

10 篇文章

订阅专栏

本文分享了一次在Vue项目中使用多行文本输入的经历，揭示了一个常见误区：直接使用标准HTML的<textarea>标签而非寻找特定的Vue组件。通过对比，文章详细展示了正确的代码示例，帮助读者避免类似错误。

对后端为主要生涯的我来说，对vue自动生成表单并不是太熟悉，有一次需要使用多行文字输入或展示，这里要用到textarea标签，傻傻的以为像i-input等标签一样，需要用i-textarea来使用，结果怎么都出不来。原来是直接写textarea即可。

<Form-item label="发货备注" prop="deliveryNote">
<!--                <i-input v-model="order.deliveryNote" placeholder="发货备注"/>-->
   <textarea style="width: 100%" v-model="order.deliveryNote" placeholder="发货备注"></textarea>
</Form-item>

效果：