编译的作用域

最新推荐文章于 2020-12-08 13:09:48 发布

nanzai11111

最新推荐文章于 2020-12-08 13:09:48 发布

阅读量161

点赞数

分类专栏： vue学习心得文章标签： vue.js

本文链接：https://blog.csdn.net/nanzai11111/article/details/109096992

版权

vue学习心得专栏收录该内容

17 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang = "en">
<head>
  <meta charset = "UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
<!--  这里面isShow的值来自Vue实例里面的决定的，而不是组件里面的
      因为这个组件是数据Vue实例里面的，所以首要选择的作用域是vue实例
-->
  <cpn v-show="isShow"></cpn>
</div>
<template id="cpn">
  <h2>我是标题</h2>
  <p>哈哈哈哈哈哈</p>
  <!--这里的isShow的值是来自组件的，不是Vue实例，
  因为我们定义这个是在组件里面，所以首要选择的作用域当然是组件-->
  <button v-show="isShow"></button>
</template>
<script src="../js/vue.js"></script>
<script>
  const app = new Vue({
    el: '#app',
    data: {
      message: '你好啊！！！',
      isShow:true
    },
    components:{
      cpn:{
        template:`#cpn`,
        data(){
          return{
            isShow:false
          }
        }
      }
    }
  })
</script>
</body>
</html>