Vue 4个指令

v-html指令

v-text指令

v-html和v-text的区别 v-html只能显示标签内容不读取标签,v-text读取内容也读取标签

v-pre指令

显示标签下的内容不读取Vue

v-once指令

只执行第一次Vue内容

v-cloak指令与beforemount

先执行后加载网站

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            [v-cloak]{
                display: none;
            }
        </style>
    </head>
    <body>
        <div id="app">
            <input type="" v-model="msg" id="" value="" />
            <p v-html="msg">
                {{msg}}
            </p>
            <h1 v-text="msg">{{msg}}</h1>
            <a href="" v-pre>{{msg}}</a>
            <a href="" v-once>{{msg}}</a>
            <h1 v-cloak>{{msg}}</h1>
        </div>
        
        
        <script src="../JS/vue.min.js" type="text/javascript" charset="utf-8"></script>
         
        <script type="text/javascript">
            
            new Vue({
                el:'#app',
                data:{
                    msg:"周六正常上课"
                },
                beforeMount:function(){
        alert(1111)
                }
                
            })
        </script>
    </body>
</html>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • # 传智播客vue 学习## 1. 什么是 Vue.js* Vue 开发手机 APP 需要借助于 Weex* Vu...
    再见天才阅读 3,629评论 0 6
  • ## 框架和库的区别?> 框架(framework):一套完整的软件设计架构和**解决方案**。> > 库(lib...
    Rui_bdad阅读 2,973评论 1 4
  • vue概述 在官方文档中,有一句话对Vue的定位说的很明确:Vue.js 的核心是一个允许采用简洁的模板语法来声明...
    li4065阅读 7,275评论 0 25
  • 1 今天从店铺里回家的时候人感觉头晕,有点累,其实我并没有动手做什么,完全的观望闲人一个。 可惜了做招牌的师傅,打...
    张杨张扬阅读 267评论 0 1
  • 今天一天都在单曲循环一首英文歌,出自电影《begin again》,简单的旋律,越听越觉得能打动人心。最近的心情,...
    二瓜阅读 193评论 1 1