VUE中的Object.freeze

    科技2026-06-07  4

    场景:一个长列表数据,一般不会更改,但是vue会做getter和setter的转换

    用法:是ES5新增的特性,可以冻结一个对象,防止对象被修改 支持:vue 1.0.18+对其提供了支持,对于data或vuex里使用freeze冻结了的对象,vue不会做getter和setter的转换 注意:冻结只是冻结里面的单个属性,引用地址还是可以更改

    new Vue({ data: {// vue不会对list里的object做getter、setter绑定 list: Object.freeze([{ value: 1 },{ value: 2 }])}, mounted () {// 界面不会有响应,因为单个属性被冻结 this.list[0].value = 100; // 下面两种做法,界面都会响应 this.list = [{ value: 100 },{ value: 200 }]; this.list = Object.freeze([{ value: 100 },{ value: 200 }]); } })
    Processed: 0.012, SQL: 9