Skip to content

[vue] 删除数组用delete和Vue.delete有什么区别? #285

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
haizhilin2013 opened this issue Jun 18, 2019 · 5 comments
Open

[vue] 删除数组用delete和Vue.delete有什么区别? #285

haizhilin2013 opened this issue Jun 18, 2019 · 5 comments
Labels
vue vue

Comments

@haizhilin2013
Copy link
Collaborator

[vue] 删除数组用delete和Vue.delete有什么区别?

@haizhilin2013 haizhilin2013 added the vue vue label Jun 18, 2019
@tsejx
Copy link

tsejx commented Jul 6, 2019

  • delete:只是被删除数组成员变为 empty / undefined,其他元素键值不变
  • Vue.delete:直接删了数组成员,并改变了数组的键值(对象是响应式的,确保删除能触发更新视图,这个方法主要用于避开 Vue 不能检测到属性被删除的限制)

@Yanhua67
Copy link

Yanhua67 commented Aug 2, 2019

delete:不能触发vue的响应式更新
Vue.delete:能

@crush2020
Copy link

@tsejx

  • delete:只是被删除数组成员变为 empty / undefined,其他元素键值不变
  • Vue.delete:直接删了数组成员,并改变了数组的键值(对象是响应式的,确保删除能触发更新视图,这个方法主要用于避开 Vue 不能检测到属性被删除的限制)

学到了

@Cai-zhiji
Copy link

Cai-zhiji commented Jul 7, 2023

delete:

delete 是JavaScript的原生操作符,用于删除对象的属性。
当使用 delete 删除数组中的元素时,数组的长度不会变化,被删除元素的位置会变成 undefined。
但是,由于Vue无法检测到通过 delete 删除数组元素的操作,因此不会触发视图的更新。

const arr = [1, 2, 3];
delete arr[1]; // 将 arr[1] 设置为 undefined
console.log(arr); // [1, undefined, 3]

Vue.delete:

Vue.delete 是Vue提供的全局方法,专用于在响应式对象(如数组和对象)上删除属性或元素。
当使用 Vue.delete 删除数组中的元素时,数组的长度会更新,被删除的元素会被从数组中完全移除。
与 delete 不同,Vue.delete 操作会通知Vue进行响应式更新,从而触发视图的更新。

const arr = [1, 2, 3];
Vue.delete(arr, 1); // 从数组中移除 arr[1]
console.log(arr); // [1, 3]

在Vue中删除数组元素时应使用 Vue.delete 来确保数组的响应式更新。

@tsejx
Copy link

tsejx commented Jul 7, 2023 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
vue vue
Projects
None yet
Development

No branches or pull requests

5 participants