framework7+Vue冲突导致router属性被更改

问题:在F7的页面中使用了Vue做数据绑定,但是发现F7的router属性被更改,back方法失效,无法返回前一页面。

---------------------------------------------------------

之前的页面结构:

1 <div class="page" data-name="demo" id="vueId">
2     <div class="page-content">
3             ...
4     </div>
5 </div>

查看F7源码+他人帮助,就是Vue的范围把F7的router.previousPage的路径给影响了,应该显示前一页面的路径,却显示的当前页的路径,所以一直路由失败。

解决办法:修改页面结构,Vue单独用一个div包裹,并声明id,

<div class="page" data-name="demo">
   <div class="page-content">
      <div id="vueId">
           ...
      </div>
   </div>
</div>       

总结:这个问题给了我一个新的思路,框架组合使用的时候,对于页面结构要求严格的,分别声明其范围,不要写在同一个div上,避免冲突。