组件:可以复用的实例。使用 v-component来实现

2.通过props属性添加相应的属性,并且在模板中渲染

当模板中包含多个组件时,则需要用一个div来包裹起来。如下:

可以将原来的的点击事件,写成一个函数,这样可以执行更多的功能。

在子类中通过  emit来触发父类中的一个函数,如下:

主程序vue中写clicknow函数:

可以使用slot插槽写html代码,如下:

Vue知识整理14:组件基础的更多相关文章

  1. Vue知识整理15:组件注册

    采用局部注册组件: 将代码放在vue的一个实例中,而不是单列申明.

  2. Vue知识整理16:单文件组件

    过程较为复杂,这里直接写出视频地址,可以直接查看 https://learning.dcloud.io/#/?vid=14

  3. Vue 知识整理—01-基础

    一:Vue是什么? Vue是一个JS框架. Vue.js是一套构建用户界面的渐进式框架. 库和框架的区别: ☞库:提供一些 API 工具函数,体现了封装的思想,需要我们主动调用: ☞框架:提供一套完整 ...

  4. Vue 知识整理—02-起步

    一:Vue 语法格式: vue vm = new Vue({ //选项 }) 二:Vue 实例: <div id="app"> <p>{{message}} ...

  5. Vue知识整理13:表单输入绑定(v-model)

    text:将输入框等表单,通过data变量实现数据绑定. textbox:数据绑定 3.checkbox和redio组件: 注意:data数据变量中,checkbox有可能会有多个结果,所以用数组: ...

  6. Vue知识整理10:条件渲染(v-if v-show)

    在Vue中使用v-if等条件实现条件的判断来实现对象的显示. 也可以采用 v-show条件来实现对象的显示.

  7. Vue知识整理7:vue中函数的应用

    在vue中使用函数对字符串做相应的处理: split:分割字符,将每个字符分割为一个数组值: reverse:将字符进行逆序排序: join:将字符连接: 最终输出结果.

  8. Vue知识整理6:JavaScript表达式

    可在vue中运用js表达式,完成数据的运算(包括三元运算).比较等操作.

  9. Vue知识整理2:Vue生命周期方法

    在vue执行过程中,可以分为beforeCreate.created.BeforeMount.mounted  .BeforeUpdate.updated 等常用的方法,如下图所示. 除此之外,通过查 ...

随机推荐

  1. PHP之常用第三方库

    汇总常用的第三方库,方便快速进行开发,避免重复造轮子 1. 时间相关 nesbot/carbon(在编写 PHP 应用时经常需要处理日期和时间,使用Carbon 会很方便– 继承自 PHPDateTi ...

  2. 使用 dataset 管理数据(官网)

    ECharts 4 开始支持了 dataset 组件用于单独的数据集声明,从而数据可以单独管理,被多个组件复用,并且可以基于数据指定数据到视觉的映射.这在不少场景下能带来使用上的方便. ECharts ...

  3. roll out项目中原系统自定义程序不能编辑

    1.SE38编辑时报 程序源系统与现阶段系统不一致:Carry out repairs in non-original systems only if urgent 2.SE16N 查看表TADIR, ...

  4. 如果该虚拟机未在使用,请按“获取所有权(T)”按钮获取它的所有权。否则,请按“取消(C)”按钮以防损坏

    ---恢复内容开始--- 解决办法:打开放此台Vmware虚拟机虚拟磁盘文件及配置文件存放的位置(也就是弹出提示窗口上的路径),删除后缀为.lck的文件夹 ---恢复内容结束---

  5. 关于3.1 jmu-Java-03面向对象基础-01-构造函数与toString (3 分)

    PTA显示Compiler did not create the expected binary 不知所措   package nn;  import java.util.Scanner;       ...

  6. ARM汇编 汇编文件后缀.s与.S

    有两套汇编的语法: ARM公司的标准ARM汇编语言和GNU对ARM支持的GNU ARM汇编. ARM标准汇编语言即ARM公司的开发工具ADS里用的汇编语言: GNU汇编即在Linux下用GCC编译的汇 ...

  7. redis高可用(一)主从复制

    主从复制 读写分离 https://blog.csdn.net/u014691098/article/details/82391608

  8. CodeForces-707B(思维)

    链接: https://vjudge.net/problem/CodeForces-707B 题意: Masha wants to open her own bakery and bake muffi ...

  9. mongodb导出导入实例记录

    mongodb导出导入实例记录 平时很用mongodb,所以用到了,就需要去网上搜索方法,干脆将自己的实际经历记录下来,方便日后使用. # 大致需求 源库:db_name_mongo 源IP:192. ...

  10. 【leetcode】Basic Calculator III

    题目如下: Implement a basic calculator to evaluate a simple expression string. The expression string may ...