Comment utiliser une méthode publique dans un fichier .vue ? J'ai essayé jusqu'à présent et elle ne peut pas être appelée directement via le nom de la méthode
Par exemple :
function getId(selector) {
return document.getElementById(selector);
}
J'ai deux questions :
1. Où doit-on écrire la méthode ? Doit-elle être écrite dans main.js ou dois-je créer un fichier common.js séparé et l'importer dans main.js ?
2. Comment puis-je l'appeler dans le fichier Login.vue ? Direct getId() ne fonctionnera pas et l'erreur getId n'est pas définie sera signalée
Il existe généralement plusieurs méthodes de chargement, selon la structure du package du plug-in, mais en gros, le code de chargement est ajouté dans
main.js
或者App.vue
.Si le package du plug-in est un pur fichier JS ou CSS et expose des variables globales du plug-in, alors tant que
import 'xxxxxx'
就可以了,其中xxxxxx
est le chemin vers JS ou CSS. Ces plugins incluent jQuery et Bootstrap.Mais il convient de noter que la configuration suivante est ajoutée au fichier jQuery JS via
import '....'
加载之后不能直接使用,需要在打包脚本配置webpack.base.conf.js
(une partie de la configuration est omise) :Notez également l'ajout de
var webpack = require('webpack')
,防止报错webpack
undefined dans l'en-tête de cette configuration.Si le plug-in a été modularisé et exposé des objets ou des méthodes, mais ne peut pas être utilisé entre les modules (par exemple, en appelant le plug-in bootbox via
npm
安装到项目的bootbox
插件),我是通过在框架App.vue
里添加import bootbox from 'bootbox/bootbox.js'
,然后在App.vue
的data
中添加一行bootbox: bootbox
,在其他Vue页面中通过this.$root.bootbox
.Il existe également un plug-in qui ne peut pas être enregistré dans l'application Vue via
import
的方法加载,需要使用var xxx = require('xxx')
的方式加载。这种插件一般是作为Vue框架的插件来用的,比如Vue-filter
。这种一般是在main.js
里添加var vueFilter = require('vue-filter')
加载,然后用Vue.use(vueFilter)
使vue-filter
.Selon votre description, cette méthode écrit un autre fichier et écrit
main.js
里实现起来是没有区别的。建议在App.vue
里写这个方法,然后加到methods
里去,在需要调用的地方使用this.$root.getId()
call directement (voir le troisième cas ci-dessus)Il suffit de rentrer directement sur
main.js
中import
.Il est recommandé d'apprendre les modules ES6, d'écrire vos méthodes courantes sous forme de modules et de les appeler dans les modules qui doivent être appelés. Vous pouvez également les écrire dans main.js :
.Alors appelez
window.util.xxx
dans le monde entier.this.url.commonUrl
`Écrit dans un autre fichier, en tant que classe d'outils, il peut être importé n'importe où ailleurs, sans se limiter aux
.vue
fichiers.(util.js)
(login.vue)
1. Créez un nouveau common.js et écrivez-le comme suit :
(function(win, undefined) {
})(fenêtre);
2.Introduisez main.js
import "./common.js"
3. Peut être appelé dans n'importe quel fichier .vue
<script>
export par défaut{
}
</script>
Tout comme la réponse de @rehapun, la façon de procéder est très bonne. Je l'utilise habituellement de cette façon. De plus, je voudrais ajouter que vous n'avez pas à vous soucier des références répétées entraînant une augmentation du volume de l'emballage. peut utiliser CommonsChunkPlugin pour extraire un fournisseur public lors du packaging avec webpack.
Citez d'abord le fichier js que vous avez défini
import '文件的位置'
,