05.Vue组件的核心概念(1):属性

代码地址:

https://github.com/tangjinzhou/geektime-vue-1/blob/master/%E6%BC%94%E7%A4%BADEMO%E6%BA%90%E7%A0%81/src/views/1.1/Props.vue

三个核心概念

1分44秒

第一种属性的写法,平时开发的时候不推荐这么做,对系统后期的维护是不利的

推荐使用的方式:

这是自定义的校验

list是一个数组,默认是一个空的数组

isVisible默认是false ,如果你不写默认值的,vue也会帮你处理的

onChange这里是一个属性:

使用这个组件

把属性罗列在这里

没有什么特别的展示效果。只是把我们父组件传递的值罗列在这里

这里我们看到挂载了一个title,这就是原生属性,默认自动挂载到我们的根元素

如果你并不想要这个自动挂载的功能

我们把它设置为false 就可以了inheritAttrs:false

这样title就不见了

按钮的事件,不要去这么做

如果放开这段代码就会报错。因为我们的属性是一个单行数据流的,不能够在子组件内修改父组件传递过来的值

可以使用回调的方式,但是这不是最好的方式,后续会讲到

极客时间_Vue开发实战_05.Vue组件的核心概念(1):属性的更多相关文章

  1. 极客时间_Vue开发实战_06.Vue组件的核心概念(2):事件

    06.Vue组件的核心概念(2):事件 通过emit传递给父组件 我们点击了重置失败,上层的div的click=handleDivClick是接收不到.重置失败的点击的行为的 通常情况下,你不用.st ...

  2. 极客时间_Vue开发实战_07.Vue组件的核心概念(3):插槽

    07.Vue组件的核心概念(3):插槽 严格来的说在2.0之后已经不分区这两种插槽的概念了. 因为它底层的实现已经趋向于相同了. 2.6为了兼容2.5的版本,现在依然可以用这两种写法 作用域插槽就是多 ...

  3. 极客时间_Vue开发实战_汇总贴

    视频地址: https://time.geekbang.org/course/intro/163 https://github.com/tangjinzhou/geektime-vue-1 电脑dem ...

  4. 极客时间_Vue开发实战_04.开发环境搭建

    Vue CLI的形式搭建环境: vue create hello-world 我们选择default默认的配置,提供babel和eslint的支持.如果你已经对工程化的东西非常了解了.你可以选择自定义 ...

  5. 2.基础:Vue组件的核心概念

    一.组件基础和注册 组件概念 组件系统是 Vue 的另一个重要概念,他的核心就是封装和复用. 细节 组件的name必须是全局唯一. 二.属性.事件和插槽 组件的三大核心概念:属性.事件和插槽. 属性, ...

  6. Vue学习笔记:Vue组件的核心概念(下)

    1.双向绑定和单向数据流: 本质上还是单向数据流 视图<——>数据 v-model:仅仅是一个简写,用更少代码去实现功能. 自定义事件 .sync 修饰符 2.虚拟DOM及KEY属性作用 ...

  7. 极客时间 Mysql实战45讲 07讲行锁功过:怎么减少行锁对性能的影响笔记 极客时间

    极客时间 Mysql实战45讲 07讲行锁功过:怎么减少行锁对性能的影响笔记 极客时间极客时间 Mysql实战45讲 07讲行锁功过:怎么减少行锁对性能的影响笔记 极客时间 笔记体会: 方案一,事务相 ...

  8. Mysql实战45讲 06讲全局锁和表锁:给表加个字段怎么有这么多阻碍 极客时间 读书笔记

    Mysql实战45讲 极客时间 读书笔记 Mysql实战45讲 极客时间 读书笔记 笔记体会: 根据加锁范围:MySQL里面的锁可以分为:全局锁.表级锁.行级锁 一.全局锁:对整个数据库实例加锁.My ...

  9. 【视频合集】极客时间 react实战进阶45讲 【更新中】

    https://up2.v.sharedaka.com/video/ochvq0AVfpa71A24bmugS5EewhFM1553702519936.mp4 01 React出现的历史背景及特性介绍 ...

随机推荐

  1. ANDROID STUDIO 2.2.3 DOWNLOAD FROM DL.GOOGLE.COM

    立即开始使用 Android Studio Android Studio 包含用于构建 Android 应用所需的所有工具. 下载 ANDROID STUDIO2.2.3 FOR WINDOWS (1 ...

  2. iOS 移动开发周报

    iOS 移动开发周报   前言 是的,我又开始写周报了!主要是因为喵神不写周报了,加上我发现大家对写 iOS 技术周报这件事情似乎没什么兴趣.其实我觉得这是一个挺好的学习总结的办法,所以要不就继续我来 ...

  3. iOS开发 - UIViewController控制器管理

    创建一个控制器 控制器常见的创建方式有下面几种 //通过storyboard创建 //直接创建 ViewController *vc = [[ViewController alloc] init]; ...

  4. 网络协议分析之wireshark---抓包使用

    Wireshark基本介绍和学习TCP三次握手 之前写过一篇博客:用 Fiddler 来调试HTTP,HTTPS. 这篇文章介绍另一个好用的抓包工具wireshark, 用来获取网络数据封包,包括ht ...

  5. CSS常识

    1.给一个div设置边框:border:1px #CCCCCC bold; 2.给DOM加小手:cursor:pointer; 取消小手:cursor:auto;

  6. 导入EXCEL 时间数据为小数 问题

    同事在做将EXCEL导入数据库功能时发现一个奇怪的问题:在EXCEL中,有一列数据明明呈现出时间格式,比如:18:35,但导到数据库中,居然一串长长的小数:0.7743055555555556,我靠, ...

  7. C++继承类同名数据成员被隐藏,其实都在内存里,转换后都可以被使用

    #include "stdafx.h" class A { public: int i; A() { i=; } }; class B: public A { public: in ...

  8. UIButton的selected设为TRUE时在按下时显示自己定义的背景图

    在UIButton的selected设为TRUE后.须要在按钮高亮时,显示自己定义的背景图. 经研究hightLighted和selected这两个状态是能够重叠的,就是button能够同一时候处于s ...

  9. 头文件---#include<***.h>和#include"***.h"的区别

    采用"< >"方式进行包含的头文件表示让编译器在编译器的预设标准路径下去搜索相应的头文件,如果找不到则报错. 例如:VS的安装目录\Microsoft Visual S ...

  10. maven资料

    1.配置settings.xml:http://www.cnblogs.com/jingmoxukong/p/6050172.html?utm_source=gold_browser_extensio ...