看了vue文档之后。。。。

  • 对于任何复杂逻辑,你都应当使用计算属性
  • html中的双花之内的值不一定来自data:{},还有可能来自computed:{}
  • 原数据改变,被绑定的计算属性也会改变
  • 可以将同一函数定义为一个方法而不是一个计算属性。两种方式的最终结果确实是完全相同的。然而,不同的是计算属性是基于它们的依赖进行缓存的。只在相关依赖发生改变时它们才会重新求值。
  • v-bind:class 指令也可以与普通的 class 属性共存

    绑定的数据对象class不必内联定义在模板里

  • Vue 为你提供了一种方式来表达“这两个元素是完全独立的,不要复用它们”。只需添加一个具有唯一值的 key 属性即可:复用!复用!
  • 一般来说,v-if 有更高的切换开销,而 v-show 有更高的初始渲染开销。因此,如果需要非常频繁地切换,则使用 v-show 较好;如果在运行时条件很少改变,则使用 v-if 较好。
  • 当 v-if 与 v-for 一起使用时,v-for 具有比 v-if 更高的优先级。
  • 在 v-for 块中,我们拥有对父作用域属性的完全访问权限。v-for 还支持一个可选的第二个参数为当前项的索引。
  • 可以用 v-for 通过一个对象的属性来迭代,得到每个属性的值。第二个的参数做为键名,第三个参数为索引。
  • 建议尽可能在使用 v-for 时提供 key。
  • 当在组件中使用 v-for 时,key 现在是必须的。
  • vue不能检测到的数组变化:
  1. 直接利用索引修改某项;
  2. 修改数组长度

如何能让vue检测到这种变化呢?

// Vue.set
Vue.set(vm.items, indexOfItem, newValue)
// Array.prototype.splice
vm.items.splice(indexOfItem, 1, newValue)
vm.$set(vm.items, indexOfItem, newValue)
 vm.items.splice(newLength)
  • 使用 Vue.set(object, key, value) 方法向嵌套对象添加响应式属性:
vm.$set(vm.userProfile, ‘age‘, 27)
Vue.set(vm.userProfile, ‘age‘, 27)
  • 当它们处于同一节点,v-for 的优先级比 v-if 更高,这意味着 v-if 将分别重复运行于每个 v-for 循环中。
  • 有时也需要在内联语句处理器中访问原始的 DOM 事件。可以用特殊变量 $event 把它传入方法。
  • v-model 会忽略所有表单元素的 value、checked、selected 特性的初始值而总是将 Vue 实例的数据作为数据来源。你应该通过 JavaScript 在组件的 data 选项中声明初始值。
  • 在文本区域插值 () 并不会生效,应用 v-model 来代替。
  • v-model配select,第一个option要设为disabled value=""
  • 使用自定义组件前,先new Vue一下根标签作为根实例。
  • 一个组件的 data 选项必须是一个函数而不是对象
  • 全局注册的组件可以用在其被注册之后的任何 (通过 new Vue) 新创建的 Vue 根实例,也包括其组件树中的所有子组件的模板中。

原文地址:https://www.cnblogs.com/endymion/p/9627679.html

时间: 2024-11-09 02:17:26

看了vue文档之后。。。。的相关文章

使用 MyBatis 必看三篇文档导读:MyBatis、MyBatis_Generator 与 MyBatis-Spring

太阳火神的美丽人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公用协议 转载请保留此句:太阳火神的美丽人生 -  本博客专注于 敏捷开发及移动和物联设备研究:iOS.Android.Html5.Arduino.pcDuino,否则,出自本博客的文章拒绝转载或再转载,谢谢合作. 前一篇<使用 MyBatis 必看两篇文档导读:MyBatis 与 MyBatis-Spring>,纯手工配置的框架环境.目前使用 M

使用 MyBatis 必看两篇文档导读:MyBatis 与 MyBatis-Spring

太阳火神的美丽人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公用协议 转载请保留此句:太阳火神的美丽人生 -  本博客专注于 敏捷开发及移动和物联设备研究:iOS.Android.Html5.Arduino.pcDuino,否则,出自本博客的文章拒绝转载或再转载,谢谢合作. MyBatis 简介 什么是 MyBatis ? MyBatis 是支持定制化 SQL.存储过程以及高级映射的优秀的持久层框架.MyBatis 避

简易用的curl类,没看过curl文档也能使用

一切为了简单 <?php /* * @content: 对curl进行友好封装 * @author:wmc * @createtime:2015/07/22 */ /* 功能: * 1.获取请求头信息 * 2.获取响应头信息 * 3.获取响应内容 * 4.获取请求数据 * 5.能请求 https * 6.to be continue */ class Curl_Class { /* * curl句柄 * @access protected */ protected $ch = null; /*

vue文档重读有感

vue 官方文档,每次读都有不一样的感受.项目已经做过一个了,遇到了不少问题,下面总结下这次看到的注意点: 一.指令方面 v-once  一次性绑定,只渲染元素和组件一次.随后的重新渲染,元素/组件及其所有的子节点将被视为静态内容并跳过. v-html html代码块的解析,对资讯类的网站特别重要,不过会有一定的风险,比如XSS攻击. :class 不需要三目表达式,如果后面直接是true  或者false的话 原文地址:https://www.cnblogs.com/leyan/p/81948

让你能浏览谷歌网站,仔细研究androidAPI======有独立看英语谷歌文档的能力

今天老师让我们按照API上面的例子的打下代码,想着天朝的封闭就十分讨厌不过我还是可以上谷歌.首先大家可以排除我这篇是软文................ 第一方法 就是更改HOST文件  你可以百度一下 各个系统的host文件在那个位置 我的是win7 64位的 在C:\Windows\System32\drivers\etc     host文件我放在后面给大家下载 你可以直接覆盖你的host 或者将我的内容COPY过去   然后用你的浏览器 谷歌一下  第一进安卓有点慢 不过进去以后就很快了

谈谈WebService开发-应用篇(三)-教你如何看WSDL文档

作为webservice客户端开发,在日常工作中可能经常会拿到一个对方提供的wsdl地址或文档,那么拿到这个地址后我们如何编写客户端调用代码呢,前面几篇只是以个人经验的方式写了下,那么真正要根据wsdl文档来编写客户端调用代码就必须学会看懂wsd文档.下面就结合之前的demo来深入剖析下wsdl文档,最后以图解的方式形象说明下. 本文以之前的SayHello的Demo来深入分析下wsdl文档的几个部分,个人认为可以共分6部分,下面分别介绍: <definitions/> 这部分在基础篇里已经介

XML概念,约束文档,解析

day01总结 今日内容 l XML语法 l XML约束之DTD l XML解析器介绍 l XML解析之JAXP( DOM.SAX ) l DOM4J l Schema 一.XML语法 XML概述 1 什么是XML XML全称为Extensible Markup Language, 意思是可扩展的标记语言,它是 SGML(标准通用标记语言)的一个子集. XML语法上和HTML比较相似,但HTML中的元素是固定的,而XML的标签是可以由用户自定义的. W3C在1998年2月发布1.0版本: W3C

从文档规范性中想到的

软件开发人员不只是要写程序,还要编写各式各样的文档.有的时候,花在写文档上的时间甚至还比花在写程序上的时间还要多一些.很多开发人员认为文档编写不重要,于是敷衍了事,让之后阅读文档的人看得是云里雾里,极大地影响了工作的效率. 最近,我看了两个不同软件版本中的集成测试文档,颇有感触. 集成测试文档1的结构是这样的: 1. 引言 2. 术语.定义和缩略语 3. 集成目标 4. 集成任务 4.1 集成任务1 -- 表1 -- 图1 -- 4.2 集成任务2 -- 表2 -- 图2 -- 4.3 集成任务

java实现支付宝接口--文档..转载

//实现java支付宝很简单,只要从支付宝官方下载 http://help.alipay.com/support/index_sh.htm下载程序,配置一下参数就OK了: 1.先到http://help.alipay.com/support/index_sh.htm下接口程序,右下角有个"接口资料下载"点击下载进入下载页面http://club.alipay.com/read.php?tid=9976972选择你要下载支付宝的接口类型:我是选择"支付宝即时到账收款接口&quo