本文介绍在JavaScript中判断字符串是否全为空白的两种常用方法。第一种利用trim()去除首尾空格后检查长度,第二种通过正则表达式匹配全空字符。适用于用户输入验证及回车发送等场景,确保内容非空。
一、使用场景
当需要判断用户输入是否全为空格,或在未输入内容时按回车发送,若需求要求内容不能为空,常规判断无法识别,因空格本身具有length属性,此时可应用以下两种方法。
二、方法示例
1、使用trim()方法
- trim()方法用于去除字符串首尾空格,并返回处理后的新值。
- 核心内容聚焦于js部分,回车键处理逻辑同理,本次不作演示。
<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>
三、使用正则验证
- 通过正则匹配判断字符串是否全为空,以此决定是否执行后续逻辑。
<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>
至此,关于JS判断字符串是否全为空的两种方法介绍完毕,更多相关JS判断字符串是否全为空内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站!