1、什么是组件?

组件的出现,就是为了拆分vue实例的代码量的,能够让我们以不同的组件来划分不同的功能模块,将来我们需要什么样的功能,就可以去调用对应的组件即可。

2、组件化和模块化的不同?

  • 模块化:是从代码逻辑的角度进行划分的,方便代码分层开发,保证每个功能模块的职能单一。
  • 组件化:是从UI界面的角度进行划分,,前端的组件化,方便UI组件的重用。

3、全局组件定义的三种方式:

  • 使用 Vue.extend 配合 Vue.component 方法;

  • 直接使用  Vue.component 方法;

  • 将模板字符串,定义到script标签中,同时需要使用 Vue.component 来定义组件:

        注意: 组件中的DOM结构,有且只能有唯一的根元素(Root Element)来进行包裹!

4、在组件中,“data”需要被定义为一个方法,例如:

5、在子组件中,如果将模板字符串,定义到了script标签中,如果要访问子组件的“data”属性中的值,需要用“this”来访问。

vue 组件的定义的更多相关文章

  1. vue教程3-03 vue组件,定义全局、局部组件,配合模板,动态组件

    vue教程3-03 vue组件,定义全局.局部组件,配合模板,动态组件 一.定义一个组件 定义一个组件: 1. 全局组件 var Aaa=Vue.extend({ template:'<h3&g ...

  2. Vue组件的定义、注册和调用

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>组 ...

  3. Vue组件的定义方式

    1.使用template标签定义组件 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...

  4. vue学习—组件的定义注册

    组件的定义注册 效果: 方法一: <div id="box"> <v-header></v-header> <hr /> <b ...

  5. Vue.js 2.x:组件的定义和注册(详细的图文教程)

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. 前言 什么是组件 组件: 组件的出现,就是为了拆分Vue实例的代码量的, ...

  6. vue里在自定义的组件上定义的事件

    事件分为原生事件和自定义事件. vue里在自定义的组件上定义的事件,都被认为是自定义事件,必须用$emit()来触发. 这也是子组件向父传值的原理. 如果想作为原生事件,需要在原生事件后面加上.nat ...

  7. Vue 数组封装和组件data定义为函数一些猜测

     数组封装 var vm={ list:[0,1] } var push=vm.list.push;//把数组原来的方法存起来 vm.list.push=function(arg){//重新定义数组的 ...

  8. vue.2.0-自定义全局组件

    App.vue <template> <div id="app"> <h3>welcome vue-loading</h3> < ...

  9. java+springBoot+Thymeleaf+vue分页组件的定义

    导读 本篇着重介绍java开发环境下,如何写一个vue分页组件,使用到的技术点有java.springBoot.Thymeleaf等: 分页效果图 名称为vuepagerbasic的分页组件,只包含上 ...

随机推荐

  1. 使用Vim-plug作为Vim 插件管理器

    ref: https://www.cnblogs.com/jiftle/p/6918157.html - vundle是一款老款的插件管理工具- vim-plug相对较新,特点是支持异步加载,相比vu ...

  2. H5_0004:JS设置循环debugger的方法

    在HTML页面加上如下代码,则PC打开控制台后,就会循环debugger,防止调试代码. <script>eval(function (p, a, c, k, e, r) { e = fu ...

  3. java ,用公司框架写的显示列表 Table控件

    <!DOCTYPE html> <html lang="en" xmlns:th="http://www.thymeleaf.org" lan ...

  4. VMware Workstation 常见问题解决

    本文以FAQ的方式进行整理,大家可以根据关键字进行查找即可. 问题一:VMware 安装64位操作系统报错“此主机支持Intel VT-x, 但Intel VT-x处于禁用状态” 问题二:This v ...

  5. java多线程基础篇第一篇

    1.在开始多线程之前,我们先来聊聊计算机的缓存 计算机处理一个程序需要cpu处理器与存储设备的交互.但是在计算机发展的过程中,cpu处理器的处理速度不断提高,而存储设备的读写速度却没有得到与cpu同样 ...

  6. 我的react+material-ui之路

    在学习react和material-ui时我遇到的问题和解决方法 react要安装得在当前文件夹下面安装, npm命令在当前文件夹执行 npm install -g全局安装, 不会安装在当前包下 np ...

  7. P2921 [USACO08DEC]在农场万圣节Trick or Treat on the Farm

    对于一个牛,它存在两种状态:1.处于联通分量 2.不处于联通分量.对于处于联通分量的牛,求出联通分量的大小:对于不处于联通分量的牛,求出其距离联通分量的路程+联通分量大小. 不同的联通分量,染上不同的 ...

  8. 【interview】汉诺塔学递归

    https://www.cnblogs.com/yanlingyin/archive/2011/11/14/2247594.html https://www.cnblogs.com/dmego/p/5 ...

  9. 解决tcp粘包问题

    目录 什么是粘包(演示粘包现象) 解决粘包 实际应用 什么是粘包 首先只有tcp有粘包现象,udp没有粘包 socket收发消息的原理 发送端可以是一K一K地发送数据,而接收端的应用程序可以两K两K地 ...

  10. Linux Shell下”>/dev/null 2>&1“相关知识说明

    0:表示键盘输入(stdin)1:表示标准输出(stdout),系统默认是1 2:表示错误输出(stderr) command >/dev/null 2>&1 &  == ...