最近在学习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>

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

Vue 学习笔记之 —— 组件（踩了个坑）的更多相关文章

  1. vue学习笔记(八)组件校验&通信

    前言 在上一章博客的内容中vue学习笔记(七)组件我们初步的认识了组件,并学会了如何定义局部组件和全局组件,上一篇内容仅仅只是对组件一个简单的入门,并没有深入的了解组件当中的其它机制,本篇博客将会带大 ...

  2. vue学习笔记(七)组件

    前言 在前面vue的一些博客中,我们几乎将vue的基础差不多学习完了,而从本篇博客开始将会进入到vue的另一个阶段性学习,本篇博客的内容在以后的vue项目中占很大的比重,所以小伙伴们需要认真学习,本篇 ...

  3. vue学习笔记(九)vue-cli中的组件通信

    前言 在上一篇博客vue学习笔记(八)组件校验&通信中,我们学会了vue中组件的校验和父组件向子组件传递信息以及子组件通知父组件(父子组件通信),上一篇博客也提到那是对组件内容的刚刚开始,而本 ...

  4. Vue学习笔记-Vue.js-2.X 学习(三)===>组件化高级

    (四) 组件化高级 1.插槽(slot)的基本使用 A:基本使用: <slot></slot> B:默认置:<slot><h1>中间可以放默认值< ...

  5. Vue学习笔记-Vue.js-2.X 学习(二)===>组件化开发

    ===重点重点开始 ========================== (三) 组件化开发 1.创建组件构造器: Vue.extends() 2.注册组件: Vue.component() 3.使用 ...

  6. Vue学习笔记-2

    前言 本文非vue教程,仅为学习vue过程中的个人理解与笔记,有说的不正确的地方欢迎指正讨论 1.computed计算属性函数中不能使用vm变量 在计算属性的函数中,不能使用Vue构造函数返回的vm变 ...

  7. vue 学习笔记（二）

    最近公司赶项目,一直也没时间看 vue,之前看下的都快忘得差不多了.哈哈哈,来一起回顾一下vue 学习笔记(一)后,继续向下看嘛. #表单输入绑定 基础用法 v-model 会忽略所有表单元素的 va ...

  8. vue学习笔记之：为何data是一个方法

    vue学习笔记之:为何data是一个方法 在vue开发中,我们可以发现,data中的属性值是在function中return出来的.可为何data必须是一个函数呢?我们先看官方的解释: 当一个组件被定 ...

  9. vue学习笔记(十)路由

    前言 在上一篇博客vue学习笔记(九)vue-cli中的组件通信内容中,我们学习组件通信的相关内容和进行了一些组件通信的小练习,相信大家已经掌握了vue-cli中的组件通信,而本篇博客将会带你更上一层 ...

随机推荐

  1. ffmpeg -视频旋转和高清转码示例

    手头有一个竖屏拍摄的视频(真诚建议不要这么做..),导入到电脑上以后势必要把它旋转90°,可是没想到就这样简单的一个功能,尝试了N个非编软件(openshot, pitivi,还有坑爹的lives)后 ...

  2. 【C++第一个Demo】---控制台RPG游戏1【游戏简介】

       经过1个月的制作和多次修改,终于有了基本雏形(此篇仅用于纪念历时3个多月C/C++学习所付出努力,也给和我一样苦恼于不能快速理解面向对象的同学们一点灵感) 在制作这个Demo过程中也受到了很多大 ...

  3. Docker 容器使用

    Docker 客户端 docker 客户端非常简单 ,我们可以直接输入 docker 命令来查看到 Docker 客户端的所有命令选项. runoob@runoob:~# docker :~# doc ...

  4. 创建GitHub（注册、创建仓库）

    说明: 首先,你需要注册一个 github 账号,最好取一个有意义的名字,比如姓名全拼,昵称全拼,如果被占用,可以加上有意义的数字. 本文中假设用户名为 chenqiufei 1. 注册账号 地址: ...

  5. tac - 反转显示文件

    总览 (SYNOPSIS) ../src/tac [OPTION]... [FILE]... 描述 (DESCRIPTION) 把 每个 文件 FILE 显示在 标准输出, 后面 的 行 放在 前面. ...

  6. 【LeetCode】水题（刚开始重新刷题找感觉用的）

    [9] Palindrome Number [Easy] 给一个数字,用不转化成字符串的方式判断它是否是回文. 先求数字长度,然后把数字的后半段做翻转(就是不断地取模,除10这种方式),然后判断前后半 ...

  7. mysql中创建函数

    MySql创建函数 一.查看创建函数的功能是否开启: mysql> show variables like '%func%'; +-------------------------------- ...

  8. Cross platform

    值得学习的C/C++语言开源项目 (1)ACE 庞大.复杂,适合大型项目.开源.免费,不依赖第三方库,支持跨平台. http://www.cs.wustl.edu/~schmidt/ACE.html ...

  9. LOJ6485 LJJ 学二项式定理 解题报告

    LJJ 学二项式定理 题意 \(T\)组数据,每组给定\(n,s,a_0,a_1,a_2,a_3\),求 \[ \sum_{i=0}^n \binom{n}{i}s^ia_{i\bmod 4} \] ...

  10. spring之循环依赖问题如何解决

    首先,spring是支持循环依赖的.但是循环依赖并不好. 最近,我在使用jenkins自动化部署,测试打出来的jar包,出现了循环依赖的问题. 在这里说一下,我解决问题的过程 我首先根据提示找到循环依 ...