解决vue语法会有延迟加载显现{{xxx}}的问题

 更新时间:2019年11月14日 10:35:16   作者:黝黑的码农  
今天小编就为大家分享一篇解决vue语法会有延迟加载显现{{xxx}}的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

在使用Vue写应用时发现一个问题,每当进入一些有延时的(如网络API请求)操作时,会先闪一下未编译的 Mustache 标签{{ message }},这让人很不爽。

在官网找到了解决方案:v-cloak

参照官网做法:

定义[v-cloak]的style

<style> [v-cloak] { display: none; } </style>

使用了Mustache标签的地方加上v-cloak

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

这样,Vue就可以隐藏未编译的 Mustache 标签直到实例准备完毕。实测效果很棒!

推荐大家使用阿里云,点击此链接可以领取1000元优惠券,如果你是学生还能加入云翼计划获得9.9元一个月的虚拟机优惠。

以上这篇解决vue语法会有延迟加载显现{{xxx}}的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Vue实战记录之登陆页面的实现

    Vue实战记录之登陆页面的实现

    最近学习过程中常碰到让用户登录注册这种,这篇文章主要给大家介绍了关于Vue实战记录之登陆页面实现的相关资料,需要的朋友可以参考下
    2021-06-06
  • 解决Vue.js由于延时显示了{{message}}引用界面的问题

    解决Vue.js由于延时显示了{{message}}引用界面的问题

    今天小编就为大家分享一篇解决Vue.js由于延时显示了{{message}}引用界面的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • Vue3.0使用ref和reactive来创建响应式数据

    Vue3.0使用ref和reactive来创建响应式数据

    ref 和 reactive 是 Composition API 中用来创建响应式数据的两个核心函数,在本篇文章中,我们将详细讲解如何使用 ref 和 reactive 来创建响应式数据,并展示它们之间的区别和使用场景,需要的朋友可以参考下
    2024-11-11
  • VUE学习之Element-ui文件上传实例详解

    VUE学习之Element-ui文件上传实例详解

    今天进行了element 文件上传组件的运用,写一下心得,下面这篇文章主要给大家介绍了关于VUE学习之Element-ui文件上传的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-10-10
  • vue单文件组件lint error自动fix与styleLint报错自动fix详解

    vue单文件组件lint error自动fix与styleLint报错自动fix详解

    这篇文章主要给大家介绍了关于vue单文件组件lint error自动fix与styleLint报错自动fix的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-01-01
  • elementUI中el-table表头和内容全部一行显示完整的方法

    elementUI中el-table表头和内容全部一行显示完整的方法

    最近参与web开发时,让我解决一个elementui控制内容单行显示,下面这篇文章主要给大家介绍了关于elementUI中el-table表头和内容全部一行显示完整的方法,需要的朋友可以参考下
    2023-06-06
  • vue打包生成的文件的js文件过大的优化方式

    vue打包生成的文件的js文件过大的优化方式

    这篇文章主要介绍了vue打包生成的文件的js文件过大的优化方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • 使用D3.js+Vue实现一个简单的柱形图

    使用D3.js+Vue实现一个简单的柱形图

    这篇文章主要介绍了使用D3.js+Vue实现一个简单的柱形图,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-08-08
  • Vue多页面配置打包性能优化方式(解决加载包太大加载慢问题)

    Vue多页面配置打包性能优化方式(解决加载包太大加载慢问题)

    这篇文章主要介绍了Vue多页面配置打包性能优化方式(解决加载包太大加载慢问题),具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • Vue实现兄弟组件间的联动效果

    Vue实现兄弟组件间的联动效果

    这篇文章主要介绍了Vue实现兄弟组件间的联动效果,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-01-01

最新评论