1、引入自定义的vue-myPlugin.js文件&＃xff0c;js文件名称自定义&＃xff0c;代码如下&＃xff1a;
(function (window) {const MyPlugin &＃61; {}MyPlugin.install &＃61; function (Vue, options) {Vue.myGlobalMethod &＃61; function () {console.log(&＃39;Vue函数对象的myGlobalMethod()&＃39;)}Vue.directive(&＃39;my-directive&＃39;,function (el, binding) {el.textContent &＃61; binding.value.toUpperCase();})Vue.prototype.$myMethod &＃61; function () {console.log(&＃39;vm $myMethod()&＃39;)}}window.MyPlugin &＃61; MyPlugin
})(window)
2、html页面引入自定义的vue-myPlugin.js文件&＃xff0c;并且声明使用插件vue-myPlugin.js&＃xff0c;代码和图如下&＃xff1a;
<!DOCTYPE html>
<html lang&＃61;"en">
<head><meta charset&＃61;"UTF-8"><title>插件</title>
</head>
<body><div id&＃61;"test"><p v-my-directive&＃61;"msg"></p>
</div><script type&＃61;"text/Javascript" src&＃61;"../js/vue.js"></script>
<script type&＃61;"text/Javascript" src&＃61;"vue-myPlugin.js"></script>
<script type&＃61;"text/Javascript">Vue.use(MyPlugin) const vm &＃61; new Vue({el: &＃39;#test&＃39;,data: {msg: &＃39;HaHa&＃39;}})Vue.myGlobalMethod()vm.$myMethod()new Object()
</script>
</body>
</html>
3、效果图&＃xff1a;
京公网安备 11010802041100号