diff --git a/src/index.js b/src/index.js index 51c68a3..cb11aca 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,4 @@ -import Tribute from "tributejs" +import Tribute from "tributejs"; const VueTribute = { name: "vue-tribute", @@ -14,11 +14,11 @@ const VueTribute = { deep: true, handler() { if (this.tribute) { - setTimeout( () => { + setTimeout(() => { var $el = this.$slots.default[0].elm; this.tribute.detach($el); - setTimeout( () => { + setTimeout(() => { $el = this.$slots.default[0].elm; this.tribute = new Tribute(this.options); this.tribute.attach($el); @@ -31,22 +31,28 @@ const VueTribute = { }, mounted() { if (typeof Tribute === "undefined") { - throw new Error("[vue-tribute] cannot locate tributejs!") + throw new Error("[vue-tribute] cannot locate tributejs!"); } - const $el = this.$slots.default[0].elm + const $el = this.$slots.default[0].elm; - this.tribute = new Tribute(this.options) + this.tribute = new Tribute(this.options); - this.tribute.attach($el) + this.tribute.attach($el); - $el.tributeInstance = this.tribute + $el.tributeInstance = this.tribute; + + $el.addEventListener("tribute-replaced", e => { + e.detail.event.target.dispatchEvent( + new Event("input", { bubbles: true }) + ); + }); }, beforeDestroy() { - const $el = this.$slots.default[0].elm + const $el = this.$slots.default[0].elm; if (this.tribute) { - this.tribute.detach($el) + this.tribute.detach($el); } }, render(h) { @@ -56,12 +62,12 @@ const VueTribute = { staticClass: "v-tribute" }, this.$slots.default - ) + ); } -} +}; if (typeof window !== "undefined" && window.Vue) { - window.Vue.component(VueTribute.name, VueTribute) + window.Vue.component(VueTribute.name, VueTribute); } -export default VueTribute +export default VueTribute;