您的位置:首页 > Web前端 > Vue.js

vue显示数据时,页面闪现原始代码解决方案

2018-08-08 14:12 302 查看

1. 首先在view中挂载的标签上添加v-cloak

    例:
    <div id="app" v-cloak>
    ...
    </div>

2. 在view上引用css模块并在css中加入
    [v-cloak]{
        display:none;
    }

这样就可以防止页面闪烁了。

但是有的时候会不起作用,可能是以下原因所致:

1、v-cloak的display属性被层级更高的给覆盖掉了,所以要提高层级:

   [v-cloak]{
        display:none !important;
    }

2、样式放在了@import引入的css文件中:

      v-cloak的这个样式放在@import 引入的css文件中不起作用,可以放在link引入的css文件里或者内联样式中

阅读更多
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐