Migrate use of Vue.set()

biigle · Jan 10, 2025 · 4958b71 · 4958b71
1 parent aababf3
commit 4958b71
Show file tree

Hide file tree

Showing 9 changed files with 19 additions and 19 deletions.
diff --git a/resources/assets/js/annotations/annotatorContainer.vue b/resources/assets/js/annotations/annotatorContainer.vue
@@ -377,7 +377,7 @@ export default {
 
             // Mark for deletion so the annotation is immediately removed from
             // the canvas. See https://github.com/biigle/annotations/issues/70
-            Vue.set(annotation, 'markedForDeletion', true);
+            annotation.markedForDeletion = true;
             AnnotationsStore.delete(annotation)
                 .catch(function (response) {
                     annotation.markedForDeletion = false;

diff --git a/resources/assets/js/core/models/Settings.vue b/resources/assets/js/core/models/Settings.vue
@@ -20,7 +20,7 @@ export default Vue.extend({
             } else if (this.has(key)) {
                 this.data[key] = value;
             } else {
-                Vue.set(this.data, key, value);
+                this.data[key] = value;
             }
 
             debounce(this.persist, 100, this.storageKey);
@@ -45,15 +45,15 @@ export default Vue.extend({
         restoreFromLocalStorage() {
             let data = JSON.parse(window.localStorage.getItem(this.storageKey));
             if (data) {
-                Vue.set(this, 'data', data);
+                this.data = data;
             }
         },
         restoreFromUrlParams(keys) {
             let params = urlParams.params;
             keys = keys || Object.keys(params);
             keys.forEach((key) => {
                 if (params.hasOwnProperty(key)) {
-                    Vue.set(this.data, key, params[key]);
+                    this.data[key] = params[key];
                 }
             });
         },

diff --git a/resources/assets/js/label-trees/authorizedProjectsContainer.vue b/resources/assets/js/label-trees/authorizedProjectsContainer.vue
@@ -46,7 +46,7 @@ export default {
     methods: {
         fetchOwnProjects() {
             ProjectsApi.query().then((response) => {
-                Vue.set(this, 'ownProjects', response.body);
+                this.ownProjects = response.body;
             }, handleErrorResponse);
         },
         addAuthorizedProject(project) {

diff --git a/resources/assets/js/label-trees/components/labelTree.vue b/resources/assets/js/label-trees/components/labelTree.vue
@@ -120,9 +120,9 @@ export default {
                 // update the label children with the compiled datastructure
                 this.labels.forEach(function (label) {
                     if (compiled.hasOwnProperty(label.id)) {
-                        Vue.set(label, 'children', compiled[label.id]);
+                        label.children = compiled[label.id];
                     } else {
-                        Vue.set(label, 'children', undefined);
+                        label.children = undefined;
                         // If the last child was deleted, close the label.
                         label.open = false;
                     }
@@ -305,15 +305,15 @@ export default {
         // Set the reactive label properties
         this.labels.forEach(function (label) {
             if (!label.hasOwnProperty('open')) {
-                Vue.set(label, 'open', false);
+                label.open = false;
             }
 
             if (!label.hasOwnProperty('selected')) {
-                Vue.set(label, 'selected', false);
+                label.selected = false;
             }
 
             if (!label.hasOwnProperty('favourite')) {
-                Vue.set(label, 'favourite', false);
+                label.favourite = false;
             }
         });
 

diff --git a/resources/assets/js/label-trees/labelsContainer.vue b/resources/assets/js/label-trees/labelsContainer.vue
@@ -93,8 +93,8 @@ export default {
             this.selectedName = name;
         },
         insertLabel(label) {
-            Vue.set(label, 'open', false);
-            Vue.set(label, 'selected', false);
+            label.open = false;
+            label.selected = false;
             let name = label.name.toLowerCase();
             // add the label to the array so the labels remain sorted by their name
             for (let i = 0, length = this.labels.length; i < length; i++) {

diff --git a/resources/assets/js/sync/components/entityChooser.vue b/resources/assets/js/sync/components/entityChooser.vue
@@ -86,7 +86,7 @@ export default {
     },
     methods: {
         handleSelect(entity) {
-            Vue.set(this.chosenIds, entity.id, true);
+            this.chosenIds[entity.id] = true;
         },
         handleDeselect(entity) {
             this.chosenIds[entity.id] = false;

diff --git a/resources/assets/js/sync/mixins/labelTreeImportContainer.vue b/resources/assets/js/sync/mixins/labelTreeImportContainer.vue
@@ -117,22 +117,22 @@ export default {
         },
         chooseImportParent(label) {
             if (this.hasLabelConflictingParent(label)) {
-                Vue.set(label, 'conflicting_parent_resolution', 'import');
+                label.conflicting_parent_resolution = 'import';
             }
         },
         chooseImportName(label) {
             if (this.hasLabelConflictingName(label)) {
-                Vue.set(label, 'conflicting_name_resolution', 'import');
+                label.conflicting_name_resolution = 'import';
             }
         },
         chooseExistingParent(label) {
             if (this.hasLabelConflictingParent(label)) {
-                Vue.set(label, 'conflicting_parent_resolution', 'existing');
+                label.conflicting_parent_resolution = 'existing';
             }
         },
         chooseExistingName(label) {
             if (this.hasLabelConflictingName(label)) {
-                Vue.set(label, 'conflicting_name_resolution', 'existing');
+                label.conflicting_name_resolution = 'existing';
             }
         },
     },

diff --git a/resources/assets/js/sync/volumeImportContainer.vue b/resources/assets/js/sync/volumeImportContainer.vue
@@ -34,7 +34,7 @@ export default {
     computed: {
         volumes() {
             return this.volumeCandidates.map(function (volume) {
-                Vue.set(volume, 'new_url', volume.url);
+                volume.new_url = volume.url;
 
                 if (volume.media_type_name === 'image') {
                     volume.icon = 'image';

diff --git a/resources/assets/js/volumes/annotationSessionPanel.vue b/resources/assets/js/volumes/annotationSessionPanel.vue
@@ -193,7 +193,7 @@ export default {
             response.data.forEach(function (user) {
                 user.name = user.firstname + ' ' + user.lastname;
             });
-            Vue.set(this, 'users', response.data);
+            this.users = response.data;
         },
         selectUser(user) {
             this.editedSession.users.push(user);