数组封装

  1. var vm={
  2. list:[0,1]
  3. }
  4. var push=vm.list.push;//把数组原来的方法存起来
  5. vm.list.push=function(arg){//重新定义数组的push方法
  6. push.call(this,arg);//调用老的push方法
  7. console.log('数组增加项');//执行其他相关的程序
  8. }

这里实际上新的push方法应该是放在__proto__里,上面这么写是方便理解

上面我定义了一个简单的push方法,在数组初始化的时候 用新定义的方法代替了数组原有方法,从而实现对数组操作的封装

组件data定义

  1. var component1={
  2. data:{
  3. name:'test'
  4. }
  5. }
  6. var component2={
  7. data:function(){
  8. name:'test'
  9. }
  10. }
  11.  
  12. var vm1.xxx=component1.data;//引用
  13. var vm2.xxx=component1.data();//复制

  组件的data一般是不能引用的,因为一个页面可能有好几个改类型的组件

  定义为函数,可以更方面每个组件的data初始化

  最近在使用Vue,在使用的过程中,慢慢对Vue的设计原理有了一些猜想,这个系列的文章就是阐述这些猜想,这些猜想并不是阅读源码的结果,纯粹是使用过程中的猜测,这个系列的文章会陆续更新,主要是用来和大家讨论Vue的实现。要研究Vue的实现,并不是每个人都适合直接看源码的,只是我不太适合直接看源码,我还是喜欢用了后,自己先在脑海里里YY一下,能都YY的差不多了,再去对照源码验证自己的猜想:)

  

Vue 数组封装和组件data定义为函数一些猜测的更多相关文章

  1. Vue文件封装日历组件

    封装就是要具有灵活性,样式自适应,调用的时候传入props就可以变成自己想要的样式. 效果展示网址:https://1963331542.github.io/ 源代码: <template> ...

  2. Vue 组件 data为什么是函数?

    在创建或注册模板的时候,传入一个data属性作为用来绑定的数据.但是在组件中,data必须是一个函数,而不能直接把一个对象赋值给它. Vue.component('my-component', { t ...

  3. Vue 组件 data为什么是函数

    在创建或注册模板的时候,传入一个data属性作为用来绑定的数据.但是在组件中,data必须是一个函数,而不能直接把一个对象赋值给它. Vue.component('my-component', { t ...

  4. Vue自行封装常用组件-弹出框

    使用方法: 1.在父组件中引入"box.vue" //import popUpBox from "./box.vue";   2.在父组件中注册 popUpBo ...

  5. [ vue ] Quasar封装q-dialog组件,在外层实现弹出框的开启和关闭

    场景描述: 见:https://www.cnblogs.com/remly/p/12981582.html 具体实现: <!-- 父组件 --> <template> < ...

  6. Vue自行封装常用组件-倒计时

    倒计时组件,比较复杂一点,大神勿调侃,精确到毫秒,因为项目中多次出现倒计时,所以拿出来分享下 使用方法:1.在父组件中引入"uni-countdown" //import uniC ...

  7. Vue自行封装常用组件-文本提示

    使用方法:1.在父组件中引入"toast.vue" //import toast from "./toast"; 2.在父组件中注册 toast //compo ...

  8. Vue中封装axios组件实例

    首先要创建一个网络模块network文件夹  里面要写封装好的几个组件 在config.js里面这样写 在index.js要这样写 core.js文件里面内容如下 然后要在main.js文件里面要设置 ...

  9. vue中封装swipe组件

    <template> <!-- TODO swipe --> <div id="hy-swiper"> <div class=" ...

随机推荐

  1. Asp.Net Core + Ocelot 网关搭建:路由简单配置

    前言   Ocelot是一个基于中间件的网关实现,功能有很多.从浅入深简单学习并记录一下吧.本篇就是一个简单的路由配置实现. DEMO 搭建   首先建立三个项目.Api.User,Api.Artic ...

  2. Spring(五)之Bean定义继承和依赖注入

    一.Bean定义继承 bean定义可以包含许多配置信息,包括构造函数参数,属性值和特定于容器的信息,例如初始化方法,静态工厂方法名称等. 子bean定义从父定义继承配置数据.子定义可以根据需要覆盖某些 ...

  3. HDU 1272小希的迷宫(裸并查集,要判断是否构成环,是否是连通图)

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1272 小希的迷宫 Time Limit: 2000/1000 MS (Java/Others)    ...

  4. flashcache中内存与磁盘,磁盘与磁盘的io

    flashcache中跟磁盘相关的读写分为以下两类: 1)磁盘跟内存的交互 2)磁盘跟磁盘之前的交互 比如说读不命中时就是直接从磁盘读,属于第1种情况,那读命中呢?也是属于第1种情况,不过这时候是从S ...

  5. Linux 下让终端走代理的方法

    转载: https://blog.fazero.me/2015/09/15/%E8%AE%A9%E7%BB%88%E7%AB%AF%E8%B5%B0%E4%BB%A3%E7%90%86%E7%9A%8 ...

  6. Java接口和抽象类详解

    父类定义了相关子类的共有属性和行为.而接口可以定义类的共同行为(包括非相关的类). 了解接口前,先来说说抽象类.抽象类介乎于普通类和接口之间,提供部分实现方法以及未实现方法,可以看作为一个半成品. 抽 ...

  7. node.js中用户密码的加密

    crypro实现用户密码的加密 在实际的项目中,只要涉及到用户的信息,就是十分重要的.设想一下数据库里面存放的用户的密码是明文的形式,后果是有多严重.所以今天给大家分享一下express中怎样实现用户 ...

  8. ABAP术语-V2 Module

    V2 Module 原文:http://www.cnblogs.com/qiangsheng/archive/2008/03/21/1115720.html Analogously to V1 the ...

  9. MySQL语句详解(用户表、密码、权限、远程)

    注: mysql.user表中Host为%的含义 Host列指定了允许用户登录所使用的IP,比如user=root Host=192.168.1.1.这里的意思就是说root用户只能通过192.168 ...

  10. ORACLE->SQL*Loader[20180712]

    https://docs.oracle.com/cd/B28359_01/server.111/b28319/ldr_concepts.htm#g1013706       SQL*Loader将外部 ...