vue shows the business process according to the options selected. For example, I select the options for module assembly, finished product, quality inspection and warehousing, and then click next. It shows the first page that shows the module assembly, the second page that shows the finished product, and so on the page
html:
<form action="" class="choose-form">
<ul>
<li v-for="(list,index) in lists" :key="index">
<input :id="list.val" type="checkbox" :value="list.val" v-model="isSelected" @click="clickBtn">
<label :for="list.val">{{list.title}}</label>
</li>
</ul>
<div class="select-btn">
<div class="pre-btn">
<img @click="$router.back(-1)" src="../assets/imgs/history.png" alt="">
</div>
<div class="next-btn">
<img @click="nextBtn" src="../assets/imgs/next.png" alt="">
</div>
</div>
</form>
js:
export default {
data () {
return {
checked: true,
isSave: false,
isSelected: [],
lists: [
{val: "yl", title: ""},
{val: "mk", title: ""},
{val: "cp", title: ""},
{val: "zj", title: ""},
{val: "cc", title: ""},
{val: "wl", title: ""},
{val: "xs", title: ""}
]
}
},
methods: {
// checkboxclickchecboxvaluemodel
// setTimeout
clickBtn: function () {
var self = this
setTimeout(function () {
console.log(self.isSelected)
}, 0)
},
}
}
what should I do with such a function?