Я новичок в фреймворке Nuxt и хочу интегрировать библиотеку дизайна материалов в свой проект (официальная: https://material.io/develop/web/).
. Я создал плагин с таким содержанием:
import Vue from "vue"
import mdcAutoInit from "@material/auto-init"
import { MDCTextField } from "@material/textfield"
import { MDCTextFieldIcon } from "@material/textfield/icon"
import { MDCSelect } from "@material/select"
import { MDCFormField } from "@material/form-field"
import { MDCRadio } from "@material/radio"
function init() {
/** Select */
mdcAutoInit.register("select", MDCSelect)
/** TextField */
mdcAutoInit.register("textfield", MDCTextField)
mdcAutoInit.register("textfieldIcon", MDCTextFieldIcon)
/** Radio */
mdcAutoInit.register("formfield", MDCFormField)
mdcAutoInit.register("radio", MDCRadio)
// /** Auto Init */
mdcAutoInit.apply()
}
const plugin = {
install(vm) {
console.log("Installing")
vm.component(MDCTextFieldIcon)
vm.component(MDCTextField)
vm.component(MDCSelect)
vm.component(MDCFormField)
vm.component(MDCRadio)
init()
}
}
if (typeof window !== "undefined" && window.Vue) {
window.Vue.use(plugin)
} else {
Vue.use(plugin)
}
И я добавил его в раздел плагинов в nuxt.config.js.
Кажется, это работает, когда я загружаю страницу (например, работает анимация текстового поля), но когда я меняюстраница, использующая nuxt-ссылку, текстовое поле не инициализируется.
Кто-нибудь знает, как заставить дизайн материала загрузить функцию инициализации для каждого загруженного компонента?
Заранее спасибо!