Vue 对象删除没有值的项

这篇具有很好参考价值的文章主要介绍了Vue 对象删除没有值的项。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

在调用后端查询接口时,有的要求参数对象里空值的项不要传,这个时候可以封装一个方法在调用接口前将对象过滤一遍。

1.新建一个名为tools.js的文件,里面放入以下代码

 //对象删除没有值的项

  export const removePropertyOfNull = (obj) => {

    Object.keys(obj).forEach(item=>{

      if(!obj[item] && obj[item] !== 0)  delete obj[item]

    })

    return obj;

  }

2.在页面中使用 

// 引入

import { removePropertyOfNull } from "@/utils/tools.js";

// 在方法中使用

let params = {

        pageIndex: 1,

        pageSize: 10,

        name: "张三",

        type: "",

        order: null,

        age: 0

}

params = removePropertyOfNull(params );

// params值为{ pageIndex: 1, pageSize: 10, name: "张三", age: 0 }文章来源地址https://www.toymoban.com/news/detail-820322.html

到了这里,关于Vue 对象删除没有值的项的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • JavaScript中删除两个数组对象中id相同的对象以及根据id删除数组中对象。

    1. filter方法 定义和用法 filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。 注意 : filter() 不会对空数组进行检测。 注意 : filter() 不会改变原始数组。 语法 参数说明 2. some方法 定义和用法 some() 方法用于检测数组中的元素是否满足

    2024年02月03日
    浏览(49)
  • 从 JavaScript 中的数组中删除空对象

    从数组中删除空对象: 使用 Array.filter() 方法遍历数组。 将每个对象传递给 Object.keys() 方法并检查键的长度是否不等于 0。 filter 方法将返回一个不包含空对象的新数组。 我们传递给 Array.filter 方法的函数被数组中的每个元素(对象)调用。 如果函数返回真值,则 filter 方法将

    2024年02月01日
    浏览(58)
  • JavaScript如何从数组(数组对象)中删除特定数据

    如果数组中有重复的两个元素,我们只想删除一个元素,我们必须使用另一种方法。

    2024年02月12日
    浏览(66)
  • 前端开发攻略---Vue实现防篡改水印的效果。删除元素无效!更改元素属性无效!支持图片、元素、视频等等。

    版权保护 :水印可以在图片、文档或视频中嵌入作者、品牌或版权所有者的信息,以防止未经授权的复制、传播或使用。当其他人使用带有水印的内容时,可以追溯到原始作者或版权所有者,从而加强版权保护。 身份识别 :水印可以用作作者或品牌的标识符,使观众能够轻

    2024年04月17日
    浏览(42)
  • Vue3前端开发,如何获取组件内dom对象以及子组件的属性和方法

    Vue3前端开发,借助Ref来获取组件内dom对象,借助defineExpose编译宏可以获取到子组件的属性和方法。 app入口文件,我们作为父组件,在里面调用了自定义组件TestCom.vue。 先做了一个测试,借助于ref来访问自身的dom对象。如图所示是可以拿到的。 ref又称谓钩子函数,在vue2版本中

    2024年01月22日
    浏览(60)
  • 如何查看 Chrome 网站有没有前端 JavaScript 报错?

    您可以按照以下步骤在Chrome中查看网站是否存在前端JavaScript报错: 首先,打开Chrome浏览器并访问您想要检查JavaScript报错的网站。 在Chrome浏览器中,按下\\\"Ctrl+Shift+I\\\"(在Windows和Linux上)或\\\"Cmd+Option+I\\\"(在macOS上)快捷键,打开开发者工具。 在开发者工具窗口中,点击位于顶部

    2024年02月15日
    浏览(47)
  • vue element UI el-cascader 级联选择器 获取当前选择值的整个对象

    要使用到cascader组件选中的数据的所有部分,并没有类似于select组件中的value可以指定,查看官方文档提供了新的方法,官方地址https://element.eleme.cn/#/zh-CN/component/cascader html部分 可以正常获取到该节点的全部数据,如下图所示: 如有问题请联系我~ 欢迎加入QQ群:

    2024年02月15日
    浏览(44)
  • [开发|java] java list 取某个属性最大的项

    示例代码: 在这个例子中, ageComparator 使用 Comparator.comparingInt() 方法来创建一个比较器,以便根据年龄属性进行比较。然后, Collections.max() 方法使用这个比较器来找到年龄属性最大的那个 Person 对象。

    2024年02月10日
    浏览(47)
  • 【前端|Javascript第5篇】全网最详细的JS的内置对象文章!

    前言 在当今数字时代,前端技术正日益成为塑造用户体验的关键。我们在开发中需要用到很多js的内置对象的一些属性来帮助我们更快速的进行开发。或许你是刚踏入前端领域的小白,或者是希望深入了解内置对象的开发者,不论你的经验如何,本篇博客都将给你详细的讲解

    2024年02月12日
    浏览(57)
  • VUE前端删除和批量删除

    下面给大家介绍一下前端的删除方法,在开发中 我们常常会碰到这种业务,有一些数据需要在前端进行删除,我们并 不希望他走后端的接口 ,而是在点击提交或者其他的业务完成后才走接口,这时我们就用到了vue的 前端删除 方法。 首先给大家介绍一下删除一条数据的情况

    2024年02月12日
    浏览(35)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包