为何console.log打印的数组，展开前有数据，展开后数组为空

场景

        代码如下，可以看到展开前数组明明是有值的，展开后数组为空了。

function closeDialog() {
  visible.value = false
  console.log('---', loginForm.loginName)
  loginForm.loginName.length = 0
}

分析

        这是因为浏览器Console.log()点击展开数组时，会重新去读一遍内存真实的值然后再显示，所以展开后都是最终值。

        因此，在打印二维数组时，其实如若不展开，他显示的就是当前值，但是点击展开后，会重新去内存读值，所以展开的值是最终值。

解决

 1. 打印之前克隆对象。

function closeDialog() {
  visible.value = false
  //注意使用深拷贝
  const data = loginForm.loginName.concat()
  console.log('---', data)
  loginForm.loginName.length = 0
}

        

2. Json.Stringify转换成字符串

function closeDialog() {
  visible.value = false
  console.log('---', JSON.stringify(loginForm.loginName))
  loginForm.loginName.length = 0
}