amb*_*web 5 javascript generator vue.js
我正在开发一个调查模块。我使用 Vue.js,我想知道如何在 Vue 中使用 javascript 生成器。
设想
场景如下,调查的问题和答案存储在mysql数据库中。我用 Axios 调用这个数据库,以便问题和答案存储在变量 response.data 中。
预期行为
我的目标是使用生成器函数显示单个问题及其答案选择,然后单击按钮显示下一个问题及其答案。
对于定向,最终结果在功能上应类似于以下来自 hotjar 的反馈民意调查: https: //www.hotjar.com/feedback-polls/
代码
Vue.component("frage", {
props: ["frage"],
template: "<h3> {{ frage }} </h3>",
});
let app = new Vue({
el: "#app",
data: {
auswahl: [],
picked: [],
fragen: [],
antworten: [],
frage: [],
count: 0,
pool: [],
gen: [],
},
mounted: function () {
this.getAllFragen();
this.gene();
},
methods: {
Addcount: function () {
console.log(this.fragen[this.count].quest);
this.count += 1;
let auswahl = this.fragen[this.count];
this.frage = auswahl.quest;
app.antworten = auswahl.answer;
},
werter: function () {
this.pool.push(this.picked);
},
handler: function () {
if (this.count <= this.fragen.length) {
this.Addcount();
this.werter();
console.log(this.fragen.length);
} else {
console.log("No Handler");
}
},
getAllFragen: function () {
axios
.post("../controller/readAdmin2Data.php")
.then(function (response) {
console.log(response.data);
app.frage = response.data[app.count].quest;
app.fragen = response.data;
app.antworten = response.data[app.count].answer;
})
.catch(function (error) {
console.log(error);
});
}
}
});
Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
Run Code Online (Sandbox Code Playgroud)