Fix: Tab & Tabs

This commit is contained in:
JimhHan 2021-04-04 14:38:46 +08:00
parent f59c45decd
commit 1dd47baca2
No known key found for this signature in database
GPG Key ID: 48D5D7CF95157AC5
2 changed files with 18 additions and 18 deletions

View File

@ -15,23 +15,23 @@ import Vue from "vue";
export default Vue.extend({ export default Vue.extend({
props: { props: {
title: { title: {
type: String type: String,
} },
}, },
data() { data() {
return { return {
tabID: "", tabID: "",
labelID: "" labelID: "",
}; };
}, },
beforeMount() { beforeMount() {
let tag = let tag = "tab-" + Math.random().toString(36).substring(2);
"tab-" +
Math.random()
.toString(36)
.substring(2);
this.tabID = tag; this.tabID = tag;
this.labelID = tag + "-" + "label"; this.labelID = tag + "-" + "label";
}
// Since Vue 3.0, we have no access to $children.
// So we need another approach to register our child components.
this.$parent.$data.children.push(this);
},
}); });
</script> </script>

View File

@ -29,16 +29,16 @@ import Vue from "vue";
export default Vue.extend({ export default Vue.extend({
props: { props: {
title: { title: {
type: String type: String,
} },
}, },
data() { data() {
return { return {
children: [] children: [],
}; };
}, },
created() { created() {
this.children = this.$children; this.children = [];
}, },
mounted() { mounted() {
this.$nextTick(function () { this.$nextTick(function () {
@ -53,8 +53,8 @@ export default Vue.extend({
}, },
contentTag: function () { contentTag: function () {
return "tabs-" + this.title + "-content"; return "tabs-" + this.title + "-content";
} },
} },
}); });
</script> </script>