bootstrap的popover第二次动态元素绑定问题
本文介绍了bootstrap的popover第二次动态元素绑定问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
页面html是用vue生成的, 而popover内容是由 conetnt属性 通过调用vue方法返回的html
第一次初始化是正确的, 比如popover内有个按钮, 显示的是开。
点了按钮后通过ajax修改数据 , 成功时把开改为关。
但由于数据是由vue生成的。 我在update 里把所有的popover 销毁了 ,
再初始化, 但显示的还是第一次的开, 但conetnt内容里的按钮是关的。
怎么解决这个缓存问题?
————————————————————————————————————————
PS:就算第二次把content的按钮改为一句xxxx
, popover销毁后同重新初始化,界面出来的还是原来的按钮。
PPS: 最新测试: 把content 属性全部remove掉, 再销毁, 再初始化还是原来的。
解决方案
在调用ajax返回里先把所有的popover都销毁, 再把vm.$data里用到的数据都先设置为null , 然后再用返回的数据填充回data里。
最后在updated里
$(".popover").each(function () {
var content = $(this).attr('data-content');
$(this).popover({html:true,container:"body",content:content});
})
手工把content一个个初始化就好了, 一次性$(".popover").popover('destroy').popover({html:true,container:"body"});是没效果的
这篇关于bootstrap的popover第二次动态元素绑定问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文