Skip to content

Textarea

Shows a textarea input component.

Examples

Basic input

Code

vue
<template>
  <Textarea v-model="value" />

  {{ value }}
</template>

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

const value = ref()
</script>

Disabled input

Code

vue
<template>
  <Textarea
    v-model="value"
    placeholder="Type in your message here."
    disabled
  />
</template>

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

const value = ref()
</script>

Readonly input

Code

vue
<template>
  <Textarea
    :model-value="'This is a value you can read but not edit.'"
    readonly
  />
</template>

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