Vue指令v-bloak和v-text,v-html,v-pre,v-once，大牛耗时一年最佳总结让你的web体验更丝滑

/*

1、通过属性选择器 选择到 带有属性 v-cloak的标签 让他隐藏

*/

[v-cloak]{

/* 元素隐藏 */

display: none;

}

{{msg}}

1.2跟标签内容相关的三个指令

1.21 v-text指令

v-text指令用于将数据填充到标签中,作用于插值表达式类似,但是没有闪烁问题;

如果数据中有html标签会将html标签一并输出;

v-text是单向数据绑定,数据对象上的值改变,插值会发生变化,但是插值发生变化并不影响数据对象的值;

{{msg}}

1.22 v-html指令

用法和v-text类似,但是v-html可以把html片段填充到标签中;

可能会有安全问题,一般只在可信任的内容上使用户v-html,不用在用户提交的内容上;

v-text和v-html区别:

​ v-text输出的是纯文本,浏览器不会对其在进行html解析;

​ v-html会将其当html标签解析后输出;

{{message}}