Textarea

Hiển thị form textarea cho nhập văn bản dài hơn.

Cài đặt

npm

npx @galaxy-stack/nebula-cli@latest add textarea

pnpm

pnpm dlx @galaxy-stack/nebula-cli@latest add textarea

yarn

yarn dlx @galaxy-stack/nebula-cli@latest add textarea

bun

bunx @galaxy-stack/nebula-cli@latest add textarea

Sử dụng

Vue

<script setup lang="ts">
import { Textarea } from '@/components/ui'
import { ref } from 'vue'

const message = ref('')
</script>

<template>
  <Textarea v-model="message" placeholder="Nhập tin nhắn của bạn tại đây." />
</template>

React

import { Textarea } from '@/components/ui'

export default function TextareaDemo() {
  return <Textarea placeholder="Nhập tin nhắn của bạn tại đây." />
}

Angular

import { Component } from '@angular/core';
import { TextareaComponent } from '@/components/ui';

@Component({
  selector: 'app-textarea-demo',
  standalone: true,
  imports: [TextareaComponent],
  template: `
    <ui-textarea
      [(ngModel)]="message"
      placeholder="Nhập tin nhắn của bạn tại đây."
    />
  `
})
export class TextareaDemoComponent {
  message = '';
}

API Reference

Props

Prop	Type	Default	Mô tả	Frameworks
value	string | number	-	Giá trị textarea (controlled)	All
defaultValue	string | number	-	Giá trị khởi tạo (uncontrolled)	All
placeholder	string	-	Văn bản giữ chỗ	All
disabled	boolean	false	Vô hiệu hóa textarea	All
rows	number	-	Số hàng văn bản hiển thị	All
name	string	-	Tên field cho form submission	All
required	boolean	false	Bắt buộc trường	All
readOnly	boolean	false	Chỉ đọc	All
maxLength	number	-	Số ký tự tối đa	All
autoComplete	string	-	Thuộc tính autocomplete	All
className	string	''	CSS class	All

Khả năng truy cập

• Điều hướng bàn phím: [TODO]
• Đọc màn hình: [TODO]
• Quản lý focus: [TODO]
• Tuân thủ WCAG: Tuân thủ WCAG 2.1 cấp độ AA

Tác giả

Bùi Trọng Hiếu (kevinbui)

• GitHub: @buikevin
• Email: kevinbui210191@gmail.com

Giấy phép

MIT © 2025 Bùi Trọng Hiếu (kevinbui)