vue中修改Modal的重置功能怎麼寫？（重置不單獨調後臺接口）可利用深拷貝

工做中遇到彈出模態框形式的修改功能，模態框裏面是Form表單,Form表單中的內容是從後臺獲取的，這時候用戶修改完沒有提交，而是想重置而後從新修改，怎麼辦呢？
①從新調一遍後臺的接口，將原始數據再一次放入Form中，這個方法可能會浪費資源，佔用帶寬
②能夠利用緩存
③能夠利用深拷貝
簡單解釋一下深拷貝和淺拷貝
a複製b，修改b，a也發生改變，說明拷貝不完全，此爲淺拷貝，a複製b，修改b，a不變，此爲深拷貝
深拷貝通常複雜數據類型纔會發生，緣由是基本數據類型和複雜數據類型的存儲方式不一樣。
關於深拷貝和淺拷貝的文章有不少，想多瞭解的同窗能夠自行搜索
下面直接說方法
咱們能夠封裝一個深拷貝函數，在隨便一個js文件裏面（根據本身的項目）

/**
     * 深度拷貝
     * @param {*} arr 
     */
    export const copyArray = (arr) => {
      return JSON.parse(JSON.stringify(arr))
    }

而後在你用到修改功能的vue文件中，直接引入使用就能夠le

import { copyArray } from '@/utils/util.js'
    //重置的時候
    //this.formInline是這個Form綁定的:model
    //data是初始時Form的數據（修改前）
    this.formInline = copyArray(data)

這是深拷貝的json方式，深拷貝的方式有不少，可自行了解
說一下這種方式的原理吧
上面說過基本數據類型沒有深拷貝，json.stringify()將數組數據類型轉換成字符串數據類型
字符串屬於基本數據類型，基本數據類型是按值傳遞的

var b = 1;
    var a = b;
    b++;
    console.log(a,b)//1,2

這時候進行拷貝，而後在將字符串轉換成對象，就實現了深拷貝

加油！天天進步一點點！