diff --git a/services/settings/ui/components/settings/SettingMultiChoice.vue b/services/settings/ui/components/settings/SettingMultiChoice.vue
index 65733e400f..248684e193 100644
--- a/services/settings/ui/components/settings/SettingMultiChoice.vue
+++ b/services/settings/ui/components/settings/SettingMultiChoice.vue
@@ -1,8 +1,8 @@
 <template>
   <oc-select
-      v-model="selectedOptions"
       :clearable="false"
       :options="displayOptions"
+      :value="selectedOptions"
       @input="onSelectedOption"
       multiple
   />
@@ -37,7 +37,8 @@ export default {
     }
   },
   methods: {
-    async onSelectedOption () {
+    async onSelectedOption (event) {
+      this.selectedOptions = event
       const values = []
       if (!isNil(this.selectedOptions)) {
         this.selectedOptions.forEach(displayValue => {
diff --git a/services/settings/ui/components/settings/SettingSingleChoice.vue b/services/settings/ui/components/settings/SettingSingleChoice.vue
index d04cb156fd..6e38d5e4e6 100644
--- a/services/settings/ui/components/settings/SettingSingleChoice.vue
+++ b/services/settings/ui/components/settings/SettingSingleChoice.vue
@@ -1,9 +1,9 @@
 <template>
   <div>
     <oc-select
-        v-model="selectedOption"
         :clearable="false"
         :options="displayOptions"
+        :value="selectedOption"
         @input="onSelectedOption"
        />
   </div>
@@ -38,7 +38,8 @@ export default {
     }
   },
   methods: {
-    async onSelectedOption () {
+    async onSelectedOption (event) {
+      this.selectedOption = event
       const values = []
       if (!isNil(this.selectedOption)) {
         const option = this.setting.singleChoiceValue.options.find(val => val.displayValue === this.selectedOption)