在网络加载缓慢或者刷新的时候总会有那么一瞬间出现vue的模板代码,实在很影响美观,对于我这种有强迫症的人来说实在是忍无可忍,后来经过查找资料,终于发现了解决方法,可以使用vue现成的指令来解决这个问题:v-cloak

首先在css中加入:

 [v-cloak]{
 display: none;
}

然后需要在元素加上:

 <div v-cloak>
{{demo}}
</div>

这样,v-cloak所在元素下的变量在未渲染前是不会显示的。

解决vue变量未渲染前代码显示问题的更多相关文章

  1. 解决vue视图不渲染

    动态添加对象属性 //声明var travelMainVueObj;travelMainVueObj = new Vue({ "el" : "#portletConten ...

  2. vue 实例未加载完成显示 花括号解决方案

    css [v - cloak] { display: none!important; } html < div id = "app" v-cloak >

  3. 解决Vue刷新一瞬间出现样式未加载完或者出现Vue代码问题

    解决Vue刷新一瞬间出现样式未加载完或者出现Vue代码问题: <style> [v-cloak]{ display: none; } </style> <div id=& ...

  4. 解决使用 Eruda 绑定 dom 未在指定位置显示问题

    前言 开发项目中,使用到 Eruda 打印控制台信息显示 文档:https://github.com/liriliri/eruda 安装 Eruda npm install eruda --save ...

  5. 解决vue数据渲染过程中的闪动问题

    关键代码 主要解决vue双大括号{{}}在数据渲染和加载过程中的闪动问题,而影响客服体验. html代码: <span class="tableTitle selftab" ...

  6. vue数据已渲染成 但还是报错 变量 undefined

    问题:页面上的数据已渲染出来,但是控制台还是报错变量未undefined,主要是当页面加载完成后,数据并未加载完,所以会报次错误. 解决办法:在数据渲染的主节点(最外层的div)添加 v-if=“da ...

  7. Vue部分编译不生效,解决Vue渲染时候会闪一下

    0828自我总结 Vue部分编译不生效,解决Vue渲染时候会闪一下 一.Vue编译不生效 在标签里添加v-pre <script src="vue.js"></s ...

  8. 2种方式解决vue路由跳转未匹配相应路由避免出现空白页面或者指定404页面

    https://www.cnblogs.com/goloving/p/9254084.html https://www.cnblogs.com/goloving/p/9254084.html 1.路由 ...

  9. 当Vue中img的src是动态渲染时不显示问题

    最近遇见动态渲染img时,想起了当初刚开始写vue时,曾经遇见的一个小小坑. Vue中:img的src属性是动态渲染时不显示问题1.需求:展示用户头像,数据从后台获取,如果没有拿到则显示默认图片. 如 ...

随机推荐

  1. 原生JS,运动的小人

    今天突然想起来,不知道在什么网站上看的一个纯纯的原生JS写的效果,运动的小人,所以在这里给大家分享一下代码: 并说明:这不是本人写的,而是我在浏览网站是无意中发现的,现在已经不记得是哪个网站了,但是要 ...

  2. Linux基础之-网络配置,主机名设置,ssh登陆,scp传输

    一. 网络配置修改 1.临时修改(ip,dns,netmask,gateway) 临时修改网络配置,只要没有涉及到修改配置文件的,在network服务重启后,所有设置失效 2.永久修改(ip,dns, ...

  3. linux 设置git记住密码

    linux下: 1.在~/下, touch创建文件 .git-credentials, 用vim编辑此文件,输入: https://{username}:{password}@github.com 注 ...

  4. C# 导出excel文件处理科学计数法办法

    在邦定gridview控件时在rowdatabound事件中队数据格式化 protected void DataGridView1_RowDataBound(object sender, GridVi ...

  5. tcp.cc

    ns2-tcp-tcp.cc /* -*- Mode:C++; c-basic-offset:8; tab-width:8; indent-tabs-mode:t -*- */ /* * Copyri ...

  6. redis持久化方法

    1.redis持久化,来自官方说明 如何选择使用哪种持久化方式? 一般来说, 如果想达到足以媲美 PostgreSQL 的数据安全性, 你应该同时使用两种持久化功能. 如果你非常关心你的数据, 但仍然 ...

  7. 获取Excel的单元格数据类型(靠谱)

    VBA中,单元格属性有NumberFormat可以获取单元格格式,比如: G/通式格式→常规 @→文本 yyyy/m/d→日期 问题: G/通式格式,无法知道值是整数还是浮点数, yyyy/m/d如果 ...

  8. NPM cache相关

    今天下午把package.lock.json用别人的替换了,然后编译一堆报错,这个问题弄了一下午. 总结一下经验: 1.关于npm cache NPM会把所有下载的包保存,放在用户文件夹下面,在我的w ...

  9. Hibernate多对一关联关系

    两个持久化类.Customer 和 OrderForm Customer 类. package com.zcd.hibernate.manyToOne; public class Customer { ...

  10. 用python自建一个DNS服务器

    前段日子一直在做公司的DNS调度程序,不过由于性能比较差,方案最终废弃掉了.两个半月心血,不想白白浪费掉,于是改了改,把商业秘密相关的部分去掉,变成了一个公共的DNS服务器.其实说的简单点,就是一个可 ...