随笔分类 - Vue2.0
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>图书购物车</ti
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Vue点击列表切换
阅读全文
摘要：首先介绍一下是什么意思： 意思就是当你给一个vue组件绑定事件时候，要加上native！如果是普通的html元素！就不需要 这样在组件上添加事件是没有效果的,如果是普通的html标签当然没问题比如 这样肯定没问题, 组件上添加自定义事件也没问题比如 这样也完全没有问题也直接弹出“Hello worl
阅读全文
摘要：我们知道，父组件使用 prop 传递数据给子组件。但子组件怎么跟父组件通信呢？这个时候 Vue 的自定义事件系统就派得上用场了。 使用 v-on 绑定自定义事件 每个 Vue 实例都实现了事件接口，即： 使用 $on(eventName) 监听事件 使用 $emit(eventName, optio
阅读全文
摘要：假设这是 bs-date-input 的模板： 为了给该日期选择器插件增加一个特殊的主题，我们可能需要增加一个特殊的 class，比如： 在这个例子当中，我们定义了两个不同的 class 值： form-control，来自组件自身的模板 date-picker-theme-dark，来自父组件 对
阅读全文
摘要：所谓非 prop 特性，就是指它可以直接传入组件，而不需要定义相应的 prop。 尽管为组件定义明确的 prop 是推荐的传参方式，组件的作者却并不总能预见到组件被使用的场景。所以，组件可以接收任意传入的特性，这些特性都会被添加到组件的根元素上。 例如，假设我们使用了第三方组件 bs-date-in
阅读全文
摘要：组件设计初衷就是要配合使用的，最常见的就是形成父子组件的关系：组件 A 在它的模板中使用了组件 B。 在 Vue 中，父子组件的关系可以总结为 prop 向下传递，事件向上传递。父组件通过 prop 给子组件下发数据，子组件通过事件给父组件发送消息。看看它们是怎么工作的。 Prop 使用 Prop
阅读全文
摘要：所有的 Vue 组件都是 Vue 实例,可以看成Vue组件就是Vue实例的扩展。
阅读全文
摘要：组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。在较高层面上，组件是自定义元素，Vue.js 的编译器为它添加特殊功能。在有些情况下，组件也可以表现为用 is 特性进行了扩展的原生 HTML 元素。 所有的 Vue 组件同时也都是 V
阅读全文
摘要：lazy:使用了这个修饰符将会从“input事件”变成change事件进行同步 这样输入了数字并没有显示出来而是当移开光标后在触发 number 首先谁明这个number并不是限制用户的输入,而是将用户输入的数据尝试绑定为 js 中的 number 类型 举个例子，如果用户输入300，data 中绑
阅读全文
摘要：表单输入绑定 你可以用 v-model 指令在表单 <input> 及 <textarea> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。尽管有些神奇，但 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据，并对一些极端场景进行一些特殊处理。 简单的说如
阅读全文
摘要：你可能注意到这种事件监听的方式违背了关注点分离 (separation of concern) 这个长期以来的优良传统。但不必担心，因为所有的 Vue.js 事件处理方法和表达式都严格绑定在当前视图的 ViewModel 上，它不会导致任何维护上的困难。实际上，使用 v-on 有几个好处： 扫一眼
阅读全文
摘要：left .right .middle 这些修饰符会限制处理函数仅响应特定的鼠标按钮。 如下例子 上面的例子点击鼠标左键即可触发事件 right是按鼠标右键触发事件 middle就是按下滑轮触发事件
阅读全文
摘要：可以用如下修饰符来实现仅在按下相应按键时才触发鼠标或键盘事件的监听器。 .ctrl .alt .shift .meta 例如： 就是说你必须按完 alt后再按下c才会触发事件 请注意修饰键与常规按键不同，在和 keyup 事件一起用时，事件触发时修饰键必须处于按下状态。换句话说，只有在按住 ctrl
阅读全文
摘要：在监听键盘事件时，我们经常需要检查常见的键值。Vue 允许为 v-on 在监听键盘事件时添加按键修饰符： 记住所有的 keyCode 比较困难，所以 Vue 为最常用的按键提供了别名： 全部的按键别名： .enter .tab .delete (捕获“删除”和“退格”键) .esc .space(空
阅读全文
摘要：.capture .self .once 主要学习这三个事件修饰符的用法先来看看capture capture即是给元素添加一个监听器，当元素发生冒泡时，先触发带有该修饰符的元素。若有多个该修饰符，则由外而内触发。 就是谁有该事件修饰符，就先触发谁。 例子如下: 浏览器打开如下： 当点击obj4的时
阅读全文
摘要：可以用 v-on 指令监听 DOM 事件，并在触发时运行一些 JavaScript 代码。 例子 浏览器打开如下： 每点击一次按扭数字就会加1 事件处理方法： 但这种情况不适合逻辑很复杂的时候,当逻辑很复杂时我们用v-on接收一个需要调用的方法名称 如下: 浏览器打开显示： 内联处理器中的方法 除了
阅读全文
摘要：类似于 v-if，你也可以利用带有 v-for 的 <template> 渲染多个元素。比如： 显示如下：
阅读全文
浙公网安备 33010602011771号