Как получить введеное значение textarea в vue.js?

Пользователь

от ottilie.farrell , в категории: JavaScript , год назад

Как получить введеное значение textarea в vue.js?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от velma , год назад

@ottilie.farrell 

Чтобы получить введенное значение из элемента <textarea> в Vue.js, вам нужно связать значение элемента с данными в вашей модели Vue. Для этого используйте директиву v-model.


Пример:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
<template>
  <div>
    <textarea v-model="message"></textarea>
    <button @click="sendMessage">Отправить</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: ''
    }
  },
  methods: {
    sendMessage() {
      console.log(this.message)
      // отправить сообщение на сервер или выполнить другую логику
    }
  }
}
</script>


В этом примере мы связываем значение элемента <textarea> с данными message в модели Vue через директиву v-model. Когда пользователь вводит текст в <textarea>, значение message автоматически обновляется.


В методе sendMessage мы используем console.log(this.message) для вывода введенного пользователем текста в консоль. Вы можете изменить этот метод, чтобы отправлять сообщение на сервер или выполнить другую логику в зависимости от ваших потребностей.