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. 优雅的使用git

    1.当我们成功安装git后,首先要做的就是配置我们的用户名以及邮箱: git config --global user.name "xxx" git config --global ...

  2. MySQL数据转移至SQL Server详解

    最近有个活是mysql数据转移到sql server 2012,直接手动转工作量太大,发现网上有工具教程,则记录一下. 一.安装MySQL ODBC驱动为MySQL安装Connector/ODBC驱动 ...

  3. C语言面试题大汇总之华为面试题 Eddy整理

    1.局部变量能否和全局变量重名? 答:能,局部会屏蔽全局.要用全局变量,需要使用"::" ;局部变量可以与全局变量同名,在函数内引用这个变量时,会用到同名的局部变量,而不会用到全局 ...

  4. HTTP协议6之状态码--转

    HTTP状态码,我都是现查现用. 我以前记得几个常用的状态码,比如200,302,304,404, 503. 一般来说我也只需要了解这些常用的状态码就可以了.  如果是做AJAX,REST,网络爬虫, ...

  5. 一次多个数据库tnsping及登录单点登录需求

    [环境介绍] 系统环境:Linux + Oracle 11.2.0.4.0 + python 2.7.10 [背景描述] 需求:因为涉及生产数据库较多,业务夸多个数据库使用.当收到业务有些影响时,数据 ...

  6. Swift 4 Hex Color

    上点干货,写个extension, 可以通过hex值去设置Color,以及通过UIColor的color case 去得到hex值. extension UIColor {     var toHex ...

  7. 论文翻译——Lattice indexing for spoken term detection

    第II节简要介绍与本文有关的先前工作第III节介绍文中使用的定义以及术语 第IV节介绍如何从原始ASR lattices中生成倒排索引结构 第V节详细介绍了ASR结构以及实验使用的数据 第VI节提供了 ...

  8. Access-Control-Allow-Origin设置跨域

    我来自己写一下答案,以给后来的朋友一点思路和建议:1,首先把Access-Control-Allow-Origin设置成*是不妥的,自己的接口服务器不能允许所有人都可以访问.2,具体哪里可以设置Acc ...

  9. axios formData提交数据 && axios设置charset无效???

    但是这样会出现一个问题,什么问题呢? 我设置了请求头编码utf-8,但是没生效 content-type里面没有出现utf-8???????查了很多资料,说这是axios固有的bug,我....... ...

  10. JAVA使用HttpClient时报错:Algorithm constraints check failed on signature algorithm: MD5withRSA

    今天使用httpClient.executeMethod时抛出异常:java.security.cert.CertPathValidatorException: Algorithm constrain ...