引入组件

局部引入

// parent.vue
const FTextarea = defineAsyncComponent(() => import('@/components/formaui/f-textarea/f-textarea.vue'))

基础用法

通过 v-model 双向绑定输入值

<f-textarea v-model="value" placeholder="请输入内容" padding="24rpx 30rpx" />

import { ref } from 'vue'
const value = ref('')

带标题

label 属性：左侧标题文字

<f-textarea v-model="value" label="备注" placeholder="请输入备注" show-border-bottom />

必填项

isRequired 属性：显示红色星号（默认 false）

<f-textarea v-model="value" label="反馈" is-required is-flex-start placeholder="请填写反馈" />

字数统计

showCounter 属性：显示已输入字数（默认 false）

<f-textarea v-model="value" :maxlength="50" show-counter is-textarea-border border-radius="8rpx" />

插槽

名称	说明
left	左侧插槽
right	右侧插槽

属性

名称	类型	说明	默认值
v-model	string / number	输入值	''
label	string	左侧标题	''
labelFontSize	string	标题字体大小	32rpx
labelColor	string	标题颜色	#0B1D4A
labelWidth	string	标题最小宽度	140rpx
isRequired	boolean	是否必填项	false
requiredColor	string	必填星号颜色	colors.danger 主题
requiredTop	string	必填星号顶部偏移（顶端对齐时）	32rpx
isFocus	boolean	是否自动聚焦	false
isAutoHeight	boolean	是否自动增高	false
placeholder	string	占位符	''
placeholderStyle	string	占位符样式	-
name	string	表单字段名	''
disabled	boolean	是否禁用	false
maxlength	number / string	最大长度，-1 不限制	500
fontSize	string	输入框字号	28rpx
textColor	string	输入框颜色	#0B1D4A
height	string	输入框高	200rpx
minHeight	string	输入框最小高	200rpx
isFlexStart	boolean	标题与输入框顶端对齐	false
isTextareaBorder	boolean	是否显示 textarea 边框	false
borderColor	string	边框颜色	rgba(0,0,0,0.1)
borderRadius	string	圆角	0
showBorderTop	boolean	是否显示上边框	false
showBorderBottom	boolean	是否显示下边框	false
isLineLeft	boolean	下边框是否左偏移	false
isTrim	boolean	是否去除首尾空格	true
isTextRight	boolean	文本是否右对齐	false
padding	string	容器内边距	0
bgColor	string	背景颜色	#FFFFFF
marginTop	string	上外边距	0rpx
showCounter	boolean	是否显示字数统计	false
counterColor	string	计数文字颜色	主题灰色变量
counterFontSize	string	计数文字大小	28rpx
lineHeight	string	行高	1.5
cursorSpacing	number	光标与键盘的距离	0
showConfirmBar	boolean	是否显示键盘上方完成栏	true
cursor	number	光标位置	-1
selectionStart	number	选区起始位置	-1
selectionEnd	number	选区结束位置	-1
adjustPosition	boolean	键盘弹起时是否自动上推页面	true
disableDefaultPadding	boolean	是否禁用 textarea 默认内边距	true
holdKeyboard	boolean	收起键盘时是否保持 focus	false
fixed	boolean	textarea 原生 fixed 属性	false

事件

事件名	说明	回调参数
focus	聚焦时	原生事件对象
blur	失焦时	原生事件对象
confirm	点击完成按钮时	输入值字符串
click	点击容器区域时	{ name }
linechange	行数变化时	原生 detail
keyboardheightchange	键盘高度变化时	原生 detail

方法

方法名	说明	传入参数
-	-	-