Vue 学习笔记之 —— 组件(踩了个坑)

最近在学习vue,学习组件时,遇到了一个问题,困扰了半个多小时。。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="box">
    <parent></parent>
</div>


<template id="parent">
    <child></child>
</template>
<template id="child">
    <button>显示余额</button>
</template>
<script src="../lib/vue.js"></script>
<script !src="">
    var Child = {        
        template: "#child"
    }

    var Parent = {
        template: "#parent",
        components: {
            "child": Child
        }
    }

    var vm = new Vue({
        el: "#box",
        components: {
            "parent": Parent
        }
    })
</script>
</body>
</html>

  当采用以上写法注册局部组件的时候,千万记得,子组件不是注册到实例里的,是注册到父组件上的,且一定要先创建子组件,再在父组件中注册。

posted @ 2018-04-16 16:09  Sky_Ice  阅读(182)  评论(0编辑  收藏  举报