1、使用trim()方法
trim()方法会去除首尾空格，并返回一个处理后的新值
<template>
<div class="box">content</div>
</template>
<script setup>
import { ref, reactive, toRefs, watch, computed, defineProps, } from 'vue';
import { useStore } from 'vuex';
import { useRoute, useRouter } from 'vue-router';
const route = useRoute()
const router = useRouter()
const store = useStore()
const data = reactive({
str: ' '
})
// 是否不存在
console.log(!data.str); // false
// 长度
console.log(data.str.length);//8
// 是否不存在
console.log(!data.str.trim()); //true
// 长度
console.log(data.str.trim().length); //0
// const { } = toRefs(data)
</script>
<style scoped lang="scss"></style>
2.使用正则验证
通过匹配是否全空，决定是否要进行其他逻辑
<template>
<div class="box">content</div>
</template>
<script setup>
import { ref, reactive, toRefs, watch, computed, defineProps, } from 'vue';
import { useStore } from 'vuex';
import { useRoute, useRouter } from 'vue-router';
const route = useRoute()
const router = useRouter()
const store = useStore()
const data = reactive({
str: ' '
})
let reg = new RegExp(/^[ ]*$/)
// 验证为全空，即无值
console.log(reg.test(data.str));//true
// const { } = toRefs(data)
</script>
<style scoped lang="scss"></style>