通过在css中添加下面语句,在需要不闪烁的地方添加上v-cloak属性:
css:
[v-cloak]{
display: none;
}
html:
<div class="container" v-cloak>
<h1 class="text-center">{{message}}</h1></div>
js中的model:
data:{
message:"hello"
}
出现闪烁的原因:
先加载html,后加载js
解决闪烁
1,把js放在html上面(head之间)
2.加v-bind
3.v-bind-template
4.v-cloak
补充一个小知识点:
css中添加默认属性,这是激活vue路由链接中的css样式:
.router-link-active{
color: red;
font-size: 20px;
}