当前位置: 首页 > news >正文

v-cloak的作用和原理

1、作用

v-cloak 指令常用在插值表达式的标签中,用于解决当网络加载很慢或者频繁渲染页面时,页面显示出源代码的情况。

所以为了提高用户的体验性,使用指令 v-cloak,搭配着 CSS 一起使用,在加载时隐藏挂载内容,等到加载完毕再显示渲染后的数据。

 

2、原理

先通过样式隐藏挂载内容,等到数据渲染完成后,v-cloak属性会自动去除,页面会显示最终效果。

3、v-cloak的使用

① 在插值语法所在的标签处加上v-cloak指令

<h1 v-cloak>{{ name }}</h1>

② 在 css 中设置 v-cloak 的属性为 display: none

<style type="text/css">[v-cloak] {display: none;}
</style>

http://www.lryc.cn/news/171478.html

相关文章:

  • pip pip3安装库时都指向python2的库
  • 和逸云 RK3229 如何进入maskrom强刷模式
  • 防静电离子风扇的应用及优点
  • git中无法使用方向键的问题
  • 负载均衡中间件---Nginx
  • Linux硬链接、软链接
  • React面试题总结(一)
  • 一句话设计模式12:适配器模式
  • iOS加固保护技术:保护你的iOS应用免受恶意篡改
  • 阿里云产品试用系列-云桌面电脑
  • vue3使用vue-virtual-scroller虚拟滚动遇到的问题
  • c#用Gnuplot画图源码
  • 【前端设计模式】之工厂模式
  • Hive 的函数介绍
  • 【Linux基础】第31讲 Linux用户和用户组权限控制命令(三)
  • html form表单高级用法
  • openssl升级
  • 【数据结构】图的遍历:广度优先(BFS),深度优先(DFS)
  • Mysql 学习总结(89)—— Mysql 库表容量统计
  • virtualBox安装配置使用
  • 北斗导航 | RTD、RTK完好性之B值、VPL与HPL计算(附B值计算matlab源代码)
  • more often than not 的含义
  • 【Linux】Linux环境配置安装
  • 从零学习开发一个RISC-V操作系统(二)丨GCC编译器和ELF格式
  • 论文阅读_大语言模型_Llama2
  • 当量因子法、InVEST、SolVES模型等多技术融合在生态系统服务功能社会价值评估中的应用及论文写作、拓展分析
  • k8s Limits 限制内存
  • 单片机第三季-第三课:STM32开发板原理图、配置、浮点运算单元
  • 观察者模式 发布-订阅模式(设计模式与开发实践 P8)
  • 【日常业务开发】Java实现异步编程