1.可以使用 methods 来替代 computed,效果上两个都是一样的.

但是 computed 是基于它的依赖缓存,只有相关依赖发生改变时才会重新取值。 {{ reversedMessage }}

使用 methods ,在重新渲染的时候,函数总会重新调用执 {{ reversedMessage2() }}

用 computed 性能会更好,但是如果你不希望缓存,你可以使用 methods 属性

2.事件修饰符:

.stop阻止事件冒泡

.prevent提交事件不再重载页面

.capture  添加事件侦听器时使用事件捕获模式

.self  只当事件在该元素本身(而不是子元素)触发时触发回调

.once click事件只能点击一次

3.按键修饰符

为常用的按键提供了别名 .enter  .tab  .delete ==

4.表单   v-model  复选框、select、按钮

  .lazy  input中同步的事件转变为在change事件中同步

  .number 将输入的值转变为Number类型的

  .trim 去掉收尾的空格

5.创建一个组件并使用

<div id="app">    
<runoob></runoob>

</div>

<script>

// 注册

Vue.component('runoob', {

template: '<h1>自定义组件!</h1>'   })

// 创建根实例   new Vue({     el: '#app'   })

</script>

new Vue({

el: '#app',

components: {

// <runoob> 将只在父模板可用

'runoob': Child     }   })

6.组件   父组件向子组件传值:props

子组件向父组件传值:

使用 $on(eventName) 监听事件

使用 $emit(eventName) 触发事件

7.自定义指令: directives 选项来注册局部指令

Vue.directive('focus', {

// 当绑定元素插入到 DOM 中。

inserted: function (el) {

// 聚焦元素

el.focus()     }

})

Vue基础的更多相关文章

  1. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十八║Vue基础: 指令(下)+计算属性+watch

    回顾 今天来晚辣,给公司做了一个小项目,一个瀑布流+动态视频控制的DEMO,有需要的可以联系我,公司的项目就不对外展示了(一个后端程序员真的要干前端了哈哈哈). 书接上文,昨天正式的开始了Vue的代码 ...

  2. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十九║Vue基础: 样式动态绑定+生命周期

    回顾 哈喽大家好,前后端分离系列文章又开始了,今天周一,还是感谢大家花时间来观看我写的博客,周末呢,没有写文章,但是也没有闲着,主要是研究了下遗留问题,看过之前文章的应该知道,之前的在AOP使用Red ...

  3. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 二十║Vue基础终篇:传值+组件+项目说明

    缘起 新的一天又开始啦,大家也应该看到我的标题了,是滴,Vue基础基本就到这里了,咱们回头看看这一路,如果你都看了,并且都会写了,那么现在你就可以自己写一个Demo了,如果再了解一点路由,ajax请求 ...

  4. python 全栈开发,Day89(sorted面试题,Pycharm配置支持vue语法,Vue基础语法,小清单练习)

    一.sorted面试题 面试题: [11, 33, 4, 2, 11, 4, 9, 2] 去重并保持原来的顺序 答案1: list1 = [11, 33, 4, 2, 11, 4, 9, 2] ret ...

  5. Vue 基础精讲

    Vue 基础精讲 Vue 官方文档:https://cn.vuejs.org/v2/guide/ VUE 实例 每个组件都是一个 vue 的实例. 一个 vue 项目是由实例组成的. vue 实例上有 ...

  6. Vue基础以及指令

    Vue 基础篇一   一.Vue框架介绍 之前大家学过HTML,CSS,JS,JQuery,Bootstrap,现在我们要学一个新的框架Vue~ Vue是一个构建数据驱动的web界面的渐进式框架. 目 ...

  7. 2-5 vue基础语法

    一.vue基础语法 语法: {{msg}} html赋值: v-html="" 绑定属性: v-bind:id="" 使用表达式: {{ok? "ye ...

  8. Vue 1-- ES6 快速入门、vue的基本语法、vue应用示例,vue基础语法

    一.ES6快速入门 let和const let ES6新增了let命令,用于声明变量.其用法类似var,但是声明的变量只在let命令所在的代码块内有效. { let x = 10; var y = 2 ...

  9. vue基础知识之vue-resource/axios

    Vue基础知识之vue-resource和axios(三)   vue-resource Vue.js是数据驱动的,这使得我们并不需要直接操作DOM,如果我们不需要使用jQuery的DOM选择器,就没 ...

  10. Vue基础及脚手架环境搭建

    From:http://www.jianshu.com/p/dc5057e7ad0d 一.vue基础 “Vue2.0”跟俺一起全面入坑 01 “Vue2.0”跟俺一起全面入坑 02 “Vue2.0”跟 ...

随机推荐

  1. linux下mount/unmount命令

    格式:mount [-参数] [设备名称] [挂载点] 其中常用的参数有:-a 安装在/etc/fstab文件中类出的所有文件系统.-f 伪装mount,作出检查设备和目录的样子,但并不真正挂载文件系 ...

  2. canvas动画:自由落体运动

    经过前面的文章,我们已经能够在canvas画布上画出各种炫酷的图形和画面,但是这些画面都是禁止的,怎么样才能让他们动起来呢? 如何绘制基本图形可以参考:canvas基本图形绘制 如何对基本图形移动旋转 ...

  3. Django学习-8-模板渲染的一些特性

       对于{%for i in list%}来说里面都有一个{{forloop.counter}}每次循环一次记一次数    对于{%for i in list%}来说里面都有一个{{forloop. ...

  4. 畅通工程 HDU - 1232

    某省调查城镇交通状况,得到现有城镇道路统计表,表中列出了每条道路直接连通的城镇.省政府"畅通工程"的目标是使全省任何两个城镇间都可以实现交通(但不一定有直接的道路相连,只要互相间接 ...

  5. 如果没有Build path怎么办 .project文件的修改

    <?xml version="1.0" encoding="UTF-8"?><projectDescription> <name& ...

  6. python基础练习题

    购物车程序 #!/usr/bin/env python # -*- coding: utf-8 -*- # @Time : 2018/3/6 21:01 # @Author : hyang # @Si ...

  7. 【NOIP2004】【CJOJ1703】【洛谷1092】虫食算

    题面 题目描述 所谓虫食算,就是原先的算式中有一部分被虫子啃掉了,需要我们根据剩下的数字来判定被啃掉的字母.来看一个简单的例子: 43#9865#045 +8468#6633 44445509678 ...

  8. 如何巧妙的利用selenium和requests组合来进行操作需要登录的页面

    一.在这里selenium的作用 (1)模拟的登录. (2)获取登录成功之后的cookies 代码 def start_login(self): chrome_options = Options() ...

  9. java支付宝开发-02-手机网站支付

    源码已上传github,欢迎专注:https://github.com/shirayner/alipay-wap 一.基础部分 1.手机网站支付产品介绍 1.1 阅读官方介绍: 手机网站支付产品介绍 ...

  10. opacity 与rgba区别

    rgba(r,g,b,a) rgba(r,g,b,a) r,g,b分别是颜色r g b的值(0-255),a表示透明度(0-1). opacity: value: opacity: value; va ...