mirrors/vue-tribute
2
0
Fork 0
mirror of https://github.com/tenrok/vue-tribute.git synced 2026-06-25 09:30:35 +03:00
Code Activity

Ensure v-model gets updated when choosing an item

Browse Source
This commit is contained in:
syropian
2020-07-02 12:59:55 -04:00
parent a704d8acf5
commit c08f8676be
1 changed files with 20 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/index.js
+20 -14
View File
@@ -1,4 +1,4 @@
import Tribute from "tributejs" import Tribute from "tributejs";
const VueTribute = { const VueTribute = {
name: "vue-tribute", name: "vue-tribute",
@@ -14,11 +14,11 @@ const VueTribute = {
deep: true, deep: true,
handler() { handler() {
if (this.tribute) { if (this.tribute) {
setTimeout( () => { setTimeout(() => {
var $el = this.$slots.default[0].elm; var $el = this.$slots.default[0].elm;
this.tribute.detach($el); this.tribute.detach($el);
setTimeout( () => { setTimeout(() => {
$el = this.$slots.default[0].elm; $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);
@@ -31,22 +31,28 @@ const VueTribute = {
}, },
mounted() { mounted() {
if (typeof Tribute === "undefined") { 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() { beforeDestroy() {
const $el = this.$slots.default[0].elm const $el = this.$slots.default[0].elm;
if (this.tribute) { if (this.tribute) {
this.tribute.detach($el) this.tribute.detach($el);
} }
}, },
render(h) { render(h) {
@@ -56,12 +62,12 @@ const VueTribute = {
staticClass: "v-tribute" staticClass: "v-tribute"
}, },
this.$slots.default this.$slots.default
) );
} }
} };
if (typeof window !== "undefined" && window.Vue) { if (typeof window !== "undefined" && window.Vue) {
window.Vue.component(VueTribute.name, VueTribute) window.Vue.component(VueTribute.name, VueTribute);
} }
export default VueTribute export default VueTribute;