首页 > 其他分享 >Vue面试题之如何解决vue第一次加载的时候 页面上使用的数据会闪烁?

Vue面试题之如何解决vue第一次加载的时候 页面上使用的数据会闪烁?

时间:2022-08-29 23:01:08浏览次数:68  
标签:面试题 Vue 界面 vue 字符串 闪烁 加载

引起数据闪烁的原因:界面加载的时候会把节点直接挂载到文档树中,导致{{msg+"666"}}这个字符串会显示一下,vue对象生成data数据时候 回去刷新界面把{{msg+"666"}}字符串替换成结果字符串,导致界面第一次加载的时候会闪屏。

解决方案:使用v-html,v-text指令操作,或者css中加[v-cloak] {display:none};在最大的div中加v-clock 属性。

标签:面试题,Vue,界面,vue,字符串,闪烁,加载
From: https://www.cnblogs.com/forever-ljf/p/16637706.html

相关文章

  • Vue的基础指令
    1.普通插值表达式插入数据<body> <divid="app"> <div>{{text1}}</div> <div>{{text2}}</div> </div></body><script> newVue({ el:"#app", data:{ tex......
  • 什么是vue⽣命周期?
    什么是vue⽣命周期?vue⽣命周期都有哪些钩⼦函数?这些钩⼦函数如何触发? 项⽬开发过程中,在⽣命周期⾥⾯都分别做过什么功能? ⻚⾯第⼀次加载时⽗⼦组件⽣命周期执⾏的顺......
  • 给vue单页面绑定快捷键
    created(){//添加快捷键document.addEventListener('keyup',this.handleKeyUp)},destroyed(){//删除快捷键document.removeEventListene......
  • 引入VUE的方式(8种)
    第一类:1、本地引入把vue的js文件下载下来引入   2、CDN引入把vue.js网址引入   3、把vue.js文件放在项目文件夹src中引入项目然后webpack打包 4、......
  • Vite 按需引入 Ant Design Vue 3.0
    Vite按需引入AntDesignVue3.0第一步下载:npmiunplugin-vue-components-D需要注意的是:Vite你可以用unplugin-vue-components来进行按需加载。但是此插件无法处......
  • 50道Redis高频面试题
    一、Redis到底是单线程还是多线程Redis6.0版本之前的单线程指的是其网络I/O和键值对读写是由一个线程完成。也就是只有网络请求模块和数据操作模块是单线程的,而其他的持......
  • CentOS 安装Nginx并部署vue项目
    安装yuminstallnginx配置nginx设置开机启动systemctlenablenginx启动服务systemctlstartnginx停止服务systemctlstopnginx重启服务syst......
  • vue3基础入门
    vue3基础入门官方网站:https://v3.vuejs.org/中文文档:https://staging-cn.vuejs.org/guide/introduction.html1、简介1.1、vue是什么?Vue.js(读音/vjuː/,类似于vi......
  • vue 监听事件addEventListener
    vue添加监听事件addEventListener//vue添加监听事件,addEventListener第二个参数要绑在this上,即需要在methods中声明,否则销毁的时候会报错//在mounted中监听,在beforeD......
  • Vue封装的过渡与动画
    一.作用:在插入、更新或移除DOM元素时,在合适的时候给元素添加样式类名。二.图示: 三.写法:1.准备好样式元素进入的样式:v-enter:进入的起点v-enter......