在vue向数据库提交数据的过程中,可能需要处理某些数据,比如有以下要求:传递的参数必须是以逗号分隔的分类列表

但此时如果vue组件中的数据却是数组形式的这个时候需要用到数组的 join 方法对数据进行处理

但这会导致错误,原因就是该数据已经被双向绑定,对原数据进行修改会导致错误!!!

此时就需要用到Lodash工具库中cloneDeep深拷贝的使用:


  1. 在运行依赖中安装lodash
  2. 在组件中导入loadsh,默认使用下划线(_)命名
     // 导入lodash
    import _ from 'lodash'
  3. 使用 cloneDeep 方法对数据进行深拷贝
     // loodash.cloneDeep(obj)深拷贝
    const form = _.cloneDeep(this.addForm)
    form.goods_cat = form.goods_cat.join(',')

Lodash工具库中cloneDeep深拷贝的使用的更多相关文章

  1. 前端MVC Vue2学习总结(六)——axios与跨域HTTP请求、Lodash工具库

    一.axios Vue更新到2.0之后宣告不再对vue-resource更新,推荐使用axios,axios是一个用于客户端与服务器通信的组件,axios 是一个基于Promise 用于浏览器和 no ...

  2. 《收获,不止SQL优化》这本书,有很多即用的脚本工具,或者根据自己的需求,改造重用,可以积累到自己的工具库中。

    以下两个脚本,官方来源: https://github.com/liangjingbin99/shouhuo/tree/master/%E7%AC%AC05%E7%AB%A0 1. 找出未使用绑定变量 ...

  3. lodash 工具库

    lodash是一套工具库,内部封装了很多字符串.数组.对象等常见数据类型的处理函数. 1.lodash的引用 import _ from 'lodash' 用一个数组遍历来说明为什么要使用lodash ...

  4. 4.npm模块安装和使用(axios异步请求,lodash工具库)

    建立package.json npm init 下载包 npm install axios npm install lodash 下载包,并加到package里面 npm install axios ...

  5. JavaScript 工具库:Cloudgamer JavaScript Library v0.1 发布

    JavaScript 工具库:Cloudgamer JavaScript Library v0.1 发布   研究了一年多的js,也差不多写一个自己的js库了.我写这个不算框架,只是一个小型的js工具 ...

  6. Lo-Dash – 替代 Underscore 的优秀 JS 工具库

    前端开发人员大都喜欢 Underscore,它的工具函数很实用,用法简单.这里给大家推荐另外一个功能更全面的 JavaScript 工具——Lo-Dash,帮助你更好的开发网站和 Web 应用程序. ...

  7. JS工具库之Lodash

    破狼 JavaScript工具库之Lodash 2015-04-11 16:08 by 破狼, 235 阅读, 2 评论, 收藏, 编辑 你还在为JavaScript中的数据转换.匹配.查找等烦恼吗? ...

  8. 非常好用的JavaScript 工具库--lodash

    一.什么是lodash? lodash库是一个具有一致接口.模块化.高性能等特性的 JavaScript 工具库. lodash是一个javascript库,也是Node JS的常用模块,它内部封装了 ...

  9. Xcode之外的文档浏览工具--Dash (在iOS代码库中浏览本帖)

    链接地址:http://www.cocoachina.com/bbs/read.php?tid=273479 Xcode之外的文档浏览工具--Dash    (在iOS代码库中浏览本帖)       ...

随机推荐

  1. MySQL5.7 并行复制

    MySQL5.7 并行复制 1.缘由: 某天看到主从复制延时的告警有点频繁,就想着是不是彻底可以解决一下. 一般主从复制,有三个线程参与,都是单线程:Binlog Dump(主) ----->I ...

  2. 深入研究Clang(十) Clang Static Analyzer简介

    Clang Static Analyzer 官网地址:http://clang-analyzer.llvm.org/ Clang Static Analyer是一个源码分析工具,它可以发现C.C++和 ...

  3. bfs—Catch That Cow—poj3278

    Catch That Cow Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 87152   Accepted: 27344 ...

  4. nginx经验分享

    如果我们在使用启动nginx时,遇到这样的提示: nginx: [alert] could not open error log file: open() "/usr/local/var/l ...

  5. 数学--数论--HDU-2698 Maximum Multiple(规律)

    Given an integer nn, Chiaki would like to find three positive integers xx, yy and zzsuch that: n=x+y ...

  6. RobotFrameWork 自动化环境搭建(基于 python3.6)

    一.需要安装的工具目录 安装 python3.6.0 我这里采用的是 python3.6 (目前慢慢市场在推广 python3.0 版本了) 安装 wxPython(Python 非常有名的一个GUI ...

  7. 别了,JavaScript;你好,Blazor

    Web开发与JavaScript开发向来是同义词.直到WebAssembly的横空出世,WebAssembly (Wasm)是一种在浏览器中可以执行的二进制指令. WebAssembly 的 官方工具 ...

  8. C. Coffee Break 贪心 思维 有点难 有意思

    C. Coffee Break 这个贪心之前好像写过,还是感觉挺难的,有点不会写. 这个题目大意是:给你一个数列n个元素,然后给你一天的时间,给你一个间隔时间d, 问你最少要用多少天可以把这个数列的所 ...

  9. HBase Filter 过滤器之FamilyFilter详解

    前言:本文详细介绍了 HBase FamilyFilter 过滤器 Java&Shell API 的使用,并贴出了相关示例代码以供参考.FamilyFilter 基于列族进行过滤,在工作中涉及 ...

  10. docker环境中neo4j导入导出

    neo4j 官方文档有说明,使用 neo4j-admin restore / dump 导出和恢复数据库的时候需要停掉数据,否则会报数据库正在使用的错误:command failed: the dat ...