我的survey-vue(surveyJS)在dev上运行良好,但是当我尝试部署时,在使用调查组件登陆页面时出现最大调用堆栈大小超出错误。我在想这就是我导入插件的方式,但我不确定。
插件/survey-vue.js
import Vue from "vue";
import * as surveyVue from "survey-vue";
Vue.use(surveyVue);
nuxt.config.js
plugins: [
...
{
src: '~/plugins/survey-vue',
mode: 'client'
},
]
组件/Survey.vue
<template>
<div id="surveyElement" class="w-full inline-block">
<survey :survey="surveyRender" />
</div>
</template>
<script>
import * as surveyVue from "survey-vue";
export default {
props: {
json: {
type: Object
},
results: {
type: Object
}
},
data() {
const jsonSurvey = this.json;
const survey = new surveyVue.Model(jsonSurvey);
// style the survey
var myCss = {...};
survey.onComplete.add(survey => {
this.result = survey.data;
this.sendResults()
})
survey.css = myCss
return {
surveyRender: survey,
result: []
}
},
methods: {
sendResults () {
this.$emit('resultCaptured', this.result)
}
},
created () {
}
}
</script>
页面/.vue
<template>
<div class="flex flex-col justify-center mx-auto w-full md:w-1/2 px-4">
<div class="w-auto mx-auto p-4 mt-12" v-if="surveyCreated">
<client-only>
<survey :json="json" :results="reportedSymptoms"></survey>
</client-only>
</div>
</div>
</template>
....
这里的任何见解都值得赞赏。已经尝试调试了几天,但无济于事。