根据需求,当用户输入内容不合法时,通过更改文字颜色或者更改输入框颜色,提示用户
<template>
<el-input
v-model="input"
:style = "isError?`--el-input-border-color:red;--el-input-text-color:yellow`:''"
placeholder="Please input"
@change="handleChange"/>
</template>
<script lang="ts" setup>
import { ElMessage } from 'element-plus'
import { ref } from 'vue'
const input = ref('')
const isError = ref(false)
const handleChange = (val:any)=>{
//你的判断条件
if(val){
isError.value = true
ElMessage({
message: '非法输入内容',
type: 'error',
})
}
}
</script>
上述代码中:输入内容,输入框变为红色,文字为黄色