vue组件

1.v-html,v-text,v-once,v-pre

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
   <div id='app'>
       <input type="text" v-model='msg'>
       <p v-html='msg'>{{msg}}</p>
       <h3 v-text='msg'>{{msg}}</h3>
       
       <a href="" v-once>{{msg}}</a>
       
       <h1 v-pre>{{msg}}</h1>
       
   </div>
    <script src='js/vue.js'></script>
    <script>
       new Vue({
           el:'#app',
           data:{
               msg:'hello'
           }
       })
    </script>
</body>
</html>

2.v-cloak

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

推荐阅读更多精彩内容

  • 此文基于官方文档,里面部分例子有改动,加上了一些自己的理解 什么是组件? 组件(Component)是 Vue.j...
    陆志均阅读 9,245评论 5 14
  • 什么是Vue组件 组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素,...
    bacbcc94613b阅读 4,490评论 0 0
  • 组件注册 1.组件名:建议组件名的定义不要省略,命名规则为字母全小写-且包含一个连字符my-component-n...
    大乌冬阅读 2,454评论 0 0
  • 组件注册 组件名 在注册一个组件的时候,我们始终需要给它一个名字。 该组件名就是Vue.component的第一个...
    oWSQo阅读 3,047评论 0 1
  • 这个女人,骨子里就有耐不住寂寞的基因,不服输,爱跟风,喜欢瞎折腾,最爱钱,一切与金钱有关的事都令她深深着迷。她老公...
    果妈说保险阅读 5,235评论 1 2