import{c as t,o as d,D as e}from"./index.d870aa4d.js";const o={class:"markdown-body"},a=e('

TextArea 文本域组件

介绍

文本框内输入或编辑文字，支持限制输入数量。

安装

import { createApp } from 'vue';\nimport { TextArea } from '@nutui/nutui';\n\nconst app = createApp();\napp.use(TextArea);\n\n

代码演示

基础用法

<nut-textarea v-model="value" />\n
import { ref } from 'vue';\n\nexport default {\n  setup() {\n    const value = ref('');\n    return { value };\n  },\n};\n

显示字数统计

<nut-textarea v-model="value" limit-show max-length="20" />\n

高度自定义，拉伸

<nut-textarea v-model="value" rows="10" autosize />\n

直读、禁用

<nut-textarea readonly model-value="textarea直读状态" />\n<nut-textarea disabled model-value="textarea禁用状态" limit-show max-length="20" />\n

Prop

参数说明类型默认值
v-model输入值，支持双向绑定String-
placeholder设置占位提示文字String'请输入内容'
max-length限制最长输入字符String、Number-
rowstextarea的高度String、Number2
limit-showtextarea是否展示输入字符。须配合max-length使用Booleanfalse
autosize高度是否可拉伸Booleanfalse
text-align文本位置,可选值left,center,rightStringleft
readonly只读属性Booleanfalse
disabled禁用属性Booleanfalse

Event

名称说明回调参数
change输入内容时触发val
focus聚焦时触发val
blur失焦时触发val
',19),r={expose:[],setup:e=>(e,r)=>(d(),t("div",o,[a]))};export default r;