Work for #2756 - Support Vue 3 in SurveyJS library - fixed Vue3 react…

…ivity
surveyjs · Nov 28, 2022 · 346a21a · 346a21a
1 parent befe3d1
commit 346a21a
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/packages/survey-vue-ui/src/App.vue b/packages/survey-vue-ui/src/App.vue
@@ -15,6 +15,8 @@ export default defineComponent({
   data() {
     const survey = new Model({});
     survey.title = "It works!";
+    survey.description = "Survey description";
+    survey.surveyId = "Survey1";
     return {
       survey: survey as any,
     };

diff --git a/packages/survey-vue-ui/src/base.ts b/packages/survey-vue-ui/src/base.ts
@@ -1,5 +1,5 @@
 import type { Base } from "survey-core";
-import { ref, defineComponent, type ComponentOptions } from "vue";
+import { ref, defineComponent, type ComponentOptions, unref } from "vue";
 
 function makeReactive(surveyElement: Base) {
   surveyElement.iteratePropertiesHash((propertiesHash: any, name: any) => {
@@ -15,7 +15,7 @@ function makeReactive(surveyElement: Base) {
       // (<any>Vue.util).defineReactive(propertiesHash, name, propertiesHash[name]);
       propertiesHash[name] = ref(propertiesHash[name]);
     }
-    return propertiesHash[name].value;
+    return unref(propertiesHash[name]);
   };
   surveyElement.setPropertyValueCoreHandler = (
     propertiesHash: any,

diff --git a/packages/survey-vue-ui/src/components/Survey.vue b/packages/survey-vue-ui/src/components/Survey.vue
@@ -1,6 +1,8 @@
 <template>
   <div class="survey">
     <h1>{{ model.title }}</h1>
+    <h2>{{ model.description }}</h2>
+    <div>{{ model.surveyId }}</div>
   </div>
 </template>