好资源导航 » 文章资讯 » 如何解决vue与传统jquery插件冲突

如何解决vue与传统jquery插件冲突

2024-02-27 05:40:07 46

本篇文章主要介绍了如何解决vue与传统jquery插件冲突，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧

比如基于jquery的select2插件，在vue下单独用有很多问题，其实对于这类插件，可以用vue的自定义指令和组件来包装，解决冲突的问题。引用官方vue1.0和2.0的两个例子，学习一下。

例子1.0 例子2.0

大功告成。说说基于vue1的，对于下拉单选，用vue官方的例子即可，对于多选，看下面自己写的，核心是用指令对象的el、vm等获取被select2改变后的select下拉列表的相应对象，关键点是用jquery包装原生元素后用.val()获取多选值。



Selected:{{selected}}

default
{{o.text}}


Selected:{{market}}

default
{{o.text}}

另外，在插入默认值的时候，注意做一个异步插入，因为vue更新页面是异步的，这里做了一个setTimeout(,0)。

另外在单页里，考虑在SSpa的show的时候，设置一状态位vm.isInit，表示若是初始化默认选项，判断onchange里是否触发相关改变的时候不重新设置一些值的清空以及获取。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。