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屋！