自定義js庫（scrollMonitor）內部主要Vue實例內部組件共享

這是Vue.js的問題，一般我試圖在我的.vue實例中使用'scrollMonitor'函數（通過main.js導入），但它給了我一個典型的「this.scrollMonitor不是一個函數」錯誤自定義js庫（scrollMonitor）內部主要Vue實例內部組件共享

mounted() { 
    let watcher = this.$scrollMonitor(this.$refs.nicer) 
}

在main.js ScrollMonitor庫似乎正確導入（控制檯顯示什麼是預期）：

import scrollMonitor from 'scrollmonitor' 
Vue.use(scrollMonitor) 
console.log(scrollMonitor)

再次，主要目標是使用.vue文件內的scrollMonitor功能（在vue組件實例中）。對不起，如果我在這裏丟失了一些愚蠢的東西 - 我已經在該文件中使用了一些其他庫，如Vue-Resource，所以問題不在'filepath'中，而是以我使用scrollMonitor功能的方式進行，任何幫助都非常感謝，謝謝！

來源

2017-05-21 Bohdan K

你使用的是一個普通的JavaScript庫，並試圖Vue.use它？那不會真的有效。 Vue.use只能與設計用於Vue的插件一起使用。將庫導入需要的組件，並在那裏使用它。

scrollMonitor(this.$refs.nicer)

來源

2017-05-21 18:52:33 Bert

謝謝，這是有道理的 –

對於那些誰仍然在尋找：有添加純JS庫到main.js，然後使用它們輕鬆地在全球範圍內組件的方式（這是不是混入）：

import scrollmonitor from 'scrollmonitor' 
Object.defineProperty(Vue.prototype, '$scrollmonitor', { 
    get() {return this.$root.scrollmonitor} 
})

也應該被添加到主數據的Vue對象：

data() { 
    return { scrollmonitor } 
},

然後它可以用於內安裝（）回調（不是）創建（）一）在組件本身，與滾動顯示器它可能看起來像這樣（在我的具體情況模板有一個與ref =「更好」屬性的div，'創建'是一種方法具體到庫api）：

mounted() {  
    this.$scrollmonitor.create(this.$refs.nicer) 
}

Hooray，我希望有人可能會發現這個有用的，因爲我做到了！

來源

2017-05-23 12:30:30

自定義js庫（scrollMonitor）內部主要Vue實例內部組件共享

回答

相關問題