vue 有一个输入框 如果输入框没有值则提示一个错误
时间: 2023-09-08 07:07:28 浏览: 103
vue实现一个6个输入框的验证码输入组件功能的实例代码
你可以使用 `v-model` 绑定输入框的值,并在输入框上添加 `required` 属性来实现这个功能:
```html
<template>
<div>
<label for="input">请输入:</label>
<input id="input" type="text" v-model="inputValue" required>
<p v-if="!inputValue">请输入内容!</p>
</div>
</template>
<script>
export default {
data() {
return {
inputValue: ''
}
}
}
</script>
```
在上面的例子中,我们使用了 `v-if` 指令来判断 `inputValue` 是否为空,如果为空则显示提示信息。同时,我们在 `<input>` 标签中添加了 `required` 属性,这样可以确保用户必须输入内容才能提交表单。
阅读全文