0
点赞
收藏
分享

微信扫一扫

Vue - 父子组件

是波波呀 2022-02-26 阅读 56
<body>
<div id="app">
  <comp2></comp2>
</div>

<script src="../vue.js"></script>
<script>
    // 创建第一个组件
    const component1 = Vue.extend({
      template: `
          <div>
            <h2>标题1</h2>
            <p>内容1-1</p>
            <p>内容1-2</p>
          </div>
      `
    });

    // 创建第二个组件
    const component2 = Vue.extend({
      template: `
          <div>
            <h2>标题2</h2>
            <p>内容2-1</p>
            <p>内容2-2</p>
            <comp1></comp1>
          </div>
      `,
      components: {
          comp1: component1
        }
    });
    const app = new Vue({
        el: '#app',
        data: {
            message: 'hello world'
        },
        components: {
          comp1: component1,
          comp2: component2,
        }
    })
</script>
</body>

 

举报

相关推荐

0 条评论