脚本宝典收集整理的这篇文章主要介绍了一个神奇的vue小插件，让你更easy得弹弹弹，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

用了vue，react这类的框架之后，发现组件化的开发在大部分时间很方便，但是有些时候却用起来很变扭。

比如我需要自定义一个alert组件，组件写起来很方便，但是使用的时候却是这样的：

<alert :msg="msg" v-show="showAlert"></alert>
<script>
    export default {
        data() {
            return {
                msg: "this is alert msg"
            }
        }
    }
</script>

是不是很奇怪，类似alert这种组件，讲道理我们还是更习惯直接alert("xxx")这样的使用方式，因为这类组件是上下文无关的，没必要在业务场景中先定义。

现在，使用vue的童鞋可以摆脱这个窘境了，因为一个神奇的小插件出现了vue-functional-component，用了这个插件之后，你可以很方便得调用你自定义的组件，像这样子

<script>
export default {
    ready() {
        this.$alert('msg')
    }
}
</script>

你可以跟平时一样定义你的组件，而你定义的组件的props就是你调用相应方法时可以传的参数，唯一的区别是你需要额外定义一个closeprops，并在你确定要关闭该组件时调用他，我们会帮你销毁这个组件。

详细的使用方法可以直接看文档，用法很简单简洁。

9-18更新

今天发现一个大失误，原来我一直没把包发布到npm。。。赶紧发布了一下，如果有任务问题，都可以在github的issue里面提出来

脚本宝典总结

以上是脚本宝典为你收集整理的一个神奇的vue小插件，让你更easy得弹弹弹全部内容，希望文章能够帮你解决一个神奇的vue小插件，让你更easy得弹弹弹所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。