精华内容
下载资源
问答
  • Vue中可用的判断对象是否为空的方法
    千次阅读
    2021-01-14 14:52:56

    vue有两个方法可用

    1.

    JSON.stringify(evtValue)=='{}'

    2.

    Object.keys(xxx).length==0

    js判断对象是否为空对象的几种方法

    1.将json对象转化为json字符串,再判断该字符串是否为"{}"

    var data = {};

    var b = (JSON.stringify(data) == "{}");

    alert(b);//true

    2.for in 循环判断

    var obj = {};

    var b = function() {

    for(var key in obj) {

    return false;

    }

    return true;

    }

    alert(b());//true

    3.jquery的isEmptyObject方法

    此方法是jquery将2方法(for in)进行封装,使用时需要依赖jquery

    var data = {};

    var b = $.isEmptyObject(data);

    alert(b);//true

    4.Object.getOwnPropertyNames()方法

    此方法是使用Object对象的getOwnPropertyNames方法,获取到对象中的属性名,存到一个数组中,返回数组对象,我们可以通过判断数组的length来判断此对象是否为空

    注意:此方法不兼容ie8,其余浏览器没有测试

    var data 

    更多相关内容
  • 写了个 str =”s”++; 然后出现Nan,找了一会。 收集资料如下判断: 1.判断undefined: var tmp = undefined;...2.判断null: var tmp = null; if (!tmp && typeof(tmp)!="undefined" && tmp!=0){ alert
  • 主要介绍了Vue前端判断数据对象是否为空的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • created() { this.getList() }, mounted() {}, ... let name = null let name1 = undefined let name2 = '' let name3 = 0 let name11 = 1 let name4 = '0' let name12 = '-1' let name5..
      created() {
        this.getList()
      },
      mounted() {},
      methods: {
        getList() {
          let name = null
          let name1 = undefined
          let name2 = ''
          let name3 = 0
          let name11 = 1
          let name4 = '0'
          let name12 = '-1'
          let name5 =  {}
          let name6 = []
          let name7 = {
            id: 1,
            value: 10
          }
          let name8 = [
            {id: 1,value: 10}
          ]
          let name9 = true
          let name10 = false
          if (name) { // 等于null不会走进来
            console.log(name)
          }
          if (name1) { // 等于undefined 也不会走进来
            console.log(name1)
          }
          if (name2) { // 等于空字符串也不会走进来
            console.log(name2)
          }
          if (name3) { // 等于0也不会走进来
            console.log(name3)
          }
          if (name11) { // 不等于0可以走进来
            console.log(name11)
          }
          if (name4) { // 等于字符串0也可以走进来
            console.log(name4);
          }
          if (name12) { // 字符串有值就可以走进来
            console.log(name12);
          }
          if (name5) { // 空对象也可以直接走进来
            console.log(name5);
          }
          if (name6) { // 空数组也可以直接走进来
            console.log(name6);
          }
          if (name7) { // 有属性对象 直接走进来
            console.log(name7);
          }
          if (name8) { // 有值得数组 直接走进来
            console.log(name8);
          }
          if (name9) { // 布尔值为true 直接走进来
            console.log(name9);
          }
          if (name10) { // 布尔值为false 不会走进来
            console.log(name10);
          }
          // 判断 空对象不让走进来
          //1. 将json对象转化为json字符串,在判断该字符串是否为"{}"
          let a = JSON.stringify(name5) === '{}'
          console.log('a',a);  // a 等于true
          if (JSON.stringify(name5) !== "{}") {
            console.log('12123311311')
          }
          // 2. for in判断
          let b = this.forName5(name5)
          console.log('b',b); // true  // 不是空对象就返回false  是空对象就返回true
          //3. ES6新语法
          // 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致 。
          let c = Object.keys(name7)
          console.log('c',c) // 对象有属性返回 ["id,,"value"]
          let d = Object.keys(name5)
          console.log('d',d) // 空对象返回 []  判断数组长度是否大于0即可
    
          // 判断 空数组不让走进来
          if(name6.length !== 0) {
            console.log('arr1',name6) // 不是空数组走进来
          }
          if(JSON.stringify(name6) !== "[]") {
            console.log('arr2',name6) // 不是空数组走进来
          }
        },
    
        forName5(name5) {
          for(let key in name5) {
            return false
          }
          return true
        },
      }
    
    展开全文
  • 判断运算符,null判断运算符

    在vue项目中使用es6新的运算符(例如链判断运算符,null判断运算符)会报错,编译不成功

    需要安装babel依赖,并添加到babel.config.js中。

    1.安装依赖

    //NULL判断运算符 ??
    npm install @babel/plugin-proposal-nullish-coalescing-operator --save-dev
    //链判断运算符  ?.
    npm install @babel/plugin-proposal-optional-chaining --save-dev
    

    2.在babel-config.js添加配置

    plugins:[
    	// null判断运算符支持 ??
        '@babel/plugin-proposal-nullish-coalescing-operator',
        // 链判断运算符支持 ?.
        '@babel/plugin-proposal-optional-chaining'
    ]
    
    展开全文
  • 使用 null 而不是传递一个空字符串,这可能会导致DOM输出的一个空类。在你的三元操作符中,你可以返回 null。这将确保DOM没有空类:比较空字符串 '' 和 null让我们深入研究上面的示例,然后更全面地了解正在发生...

    使用 null 而不是传递一个空字符串,这可能会导致DOM输出中的一个空类。在你的三元操作符中,你可以返回 null。这将确保DOM中没有空类:

    比较空字符串 '' 和 null

    让我们深入研究上面的示例,然后更全面地了解正在发生的事情。

    (1) 方案1:使用空字符串 '' /

    我们使用三元运算符根据 isBold 是true还是falsy来有条件地设置适当的类。在此示例中,我们要说的是,如果 isBold 是 true 的,它将把该类设置为 bold。如果是 false 的,它将返回一个空字符串 “”。 :class 是 v-bind:class 的缩写。

    data() {

    return {

    isBold: false

    }

    }

    这将渲染:

    如果 isBold 为 true ,它将渲染:

    (2) 方案2:使用 null /

    好吧,让我们看看如果将 null 分配为类的值会发生什么。

    data() {

    return {

    isBold: false

    }

    }

    这将渲染:

    如果 isBold 为 true ,它将渲染:

    (3) 方案3:使用undefined /

    顺便说一句, undefined 也可以工作

    false值

    提醒一下,这些是JavaScript中的false值。因此,如果 isBold 是这些值中的任何一个,它将返回三元运算符的false条件。

    false

    undefined

    null

    NaN

    0

    "" or '' or `` (empty string)

    使用对象语法重构

    在我的简单示例中,使用对象语法可能更好一些,如下所示:

    我猜使用三元运算符的一个更好的例子是设置多个类。

    题外话:当我创作Demo时,我总是尽量让事情变得简单。其中一种方法就是尽可能地减少视觉噪音。因此,我的例子有时会过于简化,希望读者能够在不做太多处理的情况下立即掌握概念。《别让我思考》这本书给了我很大的启发。好了,言归正传,我们回到主菜上吧!

    使用&&设置class

    让我们探索另一种情况,看看是否可行。

    && 不仅是产生布尔值的逻辑运算符,它实际上可以产生一个值。因此,这就是说如果 isBold 为真,则返回 bold。但是,如果isBold 为假,则返回 isBold 的值。

    强调最后一点——它将返回isBold的值。所以我们原来的空类问题仍然可以存在,取决于 isBold 的值是什么。我们来看看一些例子。

    例子1: isBold 等于 false /

    这仍将渲染空类

    例子2: isBold 等于 null /

    由于 isBold 为 null,因此空类消失了 。

    && 并没有错——事实上它正在做它的工作,只是我们需要一个具体的返回值。在其他方面,我们不能渲染空类,我们必须传递 null 或 undefined。任何其他的假值都是不行的,因为这一点很容易被忽略,所以我更喜欢更明确的三元操作符或者简单的对象语法 。

    空类属性不好吗?

    我试着用W3C Markup Validation Service检查了一下,两种语法确实都通过了。

    ...
    ...

    深入探讨HTML标准:空属性语法,似乎并不禁止空属性。

    但是...

    但是有效性不适用于 id,因为空ID被认为是无效的。

    ...
    ...
    ...

    错误:ID不能为空字符串。

    总结

    既然空类被认为是有效的,规范也不反对,这一切都取决于你的风格选择。这是你的代码库,你可以决定如何处理它。如果你想保持你的HTML输出干净,那么你可以将 null 传递给你的Vue三元操作符。如果你觉得无所谓,那就算了。这里没有错误的答案,全看你喜欢什么了。

    【编辑推荐】

    还在用if(obj!=null)做非空判断?带你快速上手Optional实战性理解!

    Java中当对象不再使用时,不赋值为null会导致什么后果 ?

    是什么让我爱上了Vue.js

    10+个很酷的Vue.js组件,模板和实验示例

    如何优雅地根治null值引起的Bug?!

    【责任编辑:赵宁宁 TEL:(010)68476606】

    展开全文
  • js判断undefined类型 今天使用showModalDialog打开页面,返回值时。当打开的页面点击关闭按钮或直接点浏览器上的关闭则返回值是undefined所以自作聪明判断  var reValue=window.showModalDialog(“”,””,””); ...
  • 本文会同步发布在微信公众号『 Vue 小 Case 』- Vue Prop null vs undefined前言:本文将引入两个 Vue 比较特殊的使用场景,带领大家熟悉一下null和undefined的区别,然后再分析一下 Vue 是怎么对 Props 做...
  • 1、JSON.stringify(this.facAnalyssisFromTem) !== "{}") 2、Object.keys(this.facAnalysLifeVo).length === 0
  • 当时就想,为啥不能传null,你前端做下判断不就行了吗。 没想到现在自己既开发前端,又开发后台,就遇到了这个问题。 其实真的就是坐下 !=null就可以了。 例子:   <span>{{...
  • vue空值判断

    2021-03-17 20:10:06
    编辑器:HBuilderX data() { return { typeArr:[{name:'短信通知...之后的方法------------------------------------ console.log(this.typeArrIndex) console.log(this.typeArrIndex == null) console.log(this.
  • vue中定义方法非空判断

    千次阅读 2020-09-04 10:37:42
    1.代码 export const isNotNullORBlank = (...args)=> { for (var i = 0;... if (argument == null || argument == '' || argument == undefined) { return false; } } return true; } 2.用法 isNot
  • vue字段null转字符串

    2021-06-03 17:22:04
    // 字段null转字符串 export function null2str(data) { for (let x in data) { if (data[x] === null) { // 如果是null 把直接内容转为 '' data[x] = ""; } else { if (Array.isArray(data[x])) {
  • // vue/dist/vue.js // 5589 var isHTMLTag = makeMap( 'html,body,base,head,link,meta,style,title,' + 'address,article,aside,footer,header,h1,h2,h3,h4,h5,h6,hgroup,nav,section,' + 'div,dd,dl,dt,...
  • 添加题目: 题目{{item.stem}} A、 {{item.choiceA}} {{item.choiceB==null}} B、{{item.choiceB}} ...
  • vue中怎么根据时间戳判断对应的时间发布时间:2021-02-14 17:30:13来源:亿速云阅读:87作者:小新这篇文章给大家分享的是有关vue中怎么根据时间戳判断对应的时间的内容。小编觉得挺实用的,因此分享给大家做个参考...
  • main.js引入store 将状态信息保存至localStorage import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) const key = 'user' const isLogin = 'isLogin' const store = new ...
  • vue中使用ES6新增功能链判断和合并运算符,如下代码 // 链判断 let obj = {} if (obj?.name) { console.log("是否存在name属性") } // 合并运算符 判断是否为 null 或 undefined if (value1 ?? value2) { } 在vue...
  • null ,"null",undefined判断

    千次阅读 2018-04-17 16:20:56
    后台返回值的时候常有返回值是null,或者”null”甚至是不返回的情况,所以前台获取数据的时候就要加以判别再进行处理,以下是工作的小总结。 undefined 如果是undefined,使用typeof来判断 var tmp = ...
  • 今天写vue的时候发现一个很灵异的问题。 let mark; if(this.AuthState===true){ mark=0; }else{ mark=1; } let data = { creator: this.userInfo.employeeCode, isLimited:mark, }; console.log(data); ...
  • 根据时间戳 来显示对应的时间段本文是根据vue缩写,但是原理都是想通的根据一个时间戳,然后来显示对应的时间段。如果为今天,则显示对应的time,如果为昨天,则显示为昨天,如果为前天,则显示为前天。剩下的显示为...
  • 实际开发工作会经常遇到一个需求,就是判断当前登录网页的设备是PC还是移动,要求PC端和移动端显示的是不同的网页内容。 那么我们就需要对当前登录设备进行判断。 main.js文件 Vue.prototype.$equipment=function...
  • VUE if判断数据类型

    2021-08-03 00:42:40
    let test=''; let test1=null; let test2=String; let test3=Number; let test4=0; let test5=' '; let test6='0'; let test7=1; if(test){ console.log('...
  • 我们在处理后台返回的信息,有的时候返回的是undefined或者null,这种字符串容易引起用户的误解,所以需要我们把这些字符串...// undefined和null转为空白字符串Vue.prototype.$praseStrEmpty = function(str) { ...
  • list: [], if (this.list.some((val) => !val.name)) { this.$message.warning("名称不能为空"); return; }
  • /** 通用工具类 / export default class func { /* 不为空 @param val @returns {boolean} */ static notEmpty(val) { return !this.isEmpty(val);...return val === null || typeof val === ‘undefined’

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 37,258
精华内容 14,903
关键字:

vue中判断null