成都创新互联网站制作重庆分公司

Vue.js中有哪些常用的指令

这篇文章将为大家详细讲解有关Vue.js中有哪些常用的指令,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。

站在用户的角度思考问题,与客户深入沟通,找到临淄网站设计与临淄网站推广的解决方案,凭借多年的经验,让设计与互联网技术结合,创造个性化、用户体验好的作品,建站类型包括:做网站、网站建设、企业官网、英文网站、手机端网站、网站推广、域名申请、网页空间、企业邮箱。业务覆盖临淄地区。

1.数据渲染:v-text、v-html、{{}}

1.1 v-text

详细:更新元素的 textContent。如果要更新部分的 textContent ,需要使用 {{ Mustache }} 插值。

实例:


 

1.2 {{}} 和上面的v-text效果一样

实例:


 

{{message}}

1.3 v-html

详细:更新元素的 innerHTML 。注意:内容按普通 HTML 插入 - 不会作为 Vue 模板进行编译 。如果试图使用v-html 组合模板,可以重新考虑通过是否通过使用组件来替代。

注意:在网站上动态渲染任意 HTML 是非常危险的,因为容易导致XSS攻击。只在可信内容上使用v-html,永不用在用户提交的内容上。

实例:


 

2.条件渲染 控制模板隐藏:v-show 、v-if、v-else

2.1 v-show

用法:根据表达式之真假值,切换元素的 display CSS 属性。当条件变化时该指令触发过渡效果。

注意: v-show 不支持