vue获取input的值

可以通过v-model指令来实现双向绑定，将input的值绑定到Vue实例中的data属性中。例如：

<template>
  <div>
    <input type="text" v-model="inputValue">
    <button @click="handleClick">提交</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      inputValue: ''
    }
  },
  methods: {
    handleClick() {
      console.log(this.inputValue)
    }
  }
}
</script>

在这个例子中，我们使用了v-model指令将input的值绑定到Vue实例中的inputValue属性中。每次input的值发生变化时，inputValue也会相应地更新。在点击提交按钮时，我们可以通过this.inputValue获取到input的值。

相关问题

vue获取input输入里的信息

可以通过v-model指令将input的value值与Vue实例中的一个变量绑定起来，然后就可以通过这个变量获取input输入里的信息了。

示例代码如下：

<template>
  <div>
    <input type="text" v-model="inputValue">
    <button @click="showInputValue">显示输入值</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      inputValue: ''
    }
  },
  methods: {
    showInputValue() {
      console.log(this.inputValue)
    }
  }
}
</script>

在这个示例中，我们用v-model指令将input的value值与Vue实例中的inputValue变量绑定起来，然后在showInputValue方法中可以通过this.inputValue获取到用户在input中输入的内容。

vue3获取input的value值

在Vue3中，可以使用v-model指令来获取input的value值。例如：

<template>
  <div>
    <input v-model="inputValue" />
    <button @click="handleClick">获取input的value值</button>
  </div>
</template>

<script>
import { ref } from 'vue'

export default {
  setup() {
    const inputValue = ref('')

    const handleClick = () => {
      console.log(inputValue.value)
    }

    return {
      inputValue,
      handleClick
    }
  }
}
</script>

在上面的代码中，我们使用了ref函数来创建一个响应式的inputValue变量，并将其绑定到input元素上。当用户输入内容时，inputValue的值会自动更新。当用户点击按钮时，我们可以通过inputValue.value来获取input的value值。