数组封装

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

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

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

组件data定义

var component1={
data:{
name:'test'
}
}
var component2={
data:function(){
name:'test'
}
} var vm1.xxx=component1.data;//引用
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. Cookies、sessionStorage和localStorage解释及区别?

    浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟服务器端进行数据交互 一.cookie和session Cookie和 session都是用来跟踪浏览 ...

  2. C#获取路径问题

    由于在写控制台的时候,不能获取到绝对的路径.(下面为学习内容) System.IO.Path类中有一些获取路径的方法,可以在控制台程序或者WinForm中根据相对路径来获取绝对路径 获取web物理路径 ...

  3. centos上nginx的安装

    安装步骤:   1.下载nginx,执行:wget http://nginx.org/download/nginx-1.10.2.tar.gz 2.解压,执行:tar vxzf nginx-1.10. ...

  4. [转]MBTiles移动存储简介

    首先奉上官网地址http://mapbox.com/developers/mbtiles/#storing_tiles 由于英文水平有限,看资料很费眼睛,特将它翻译成中文 存储瓦片 地图制作者面对一个 ...

  5. 无网络环境下使用docker加载镜像

    无网络环境下使用docker加载镜像 你需要做的主要有3步骤:   先从一个有网络的电脑下载docker镜像 [root@localhost ~]# docker pull hub.c.163.com ...

  6. Dubbo实践(十四)生产者发布服务

    Export发布服务流程 Dubbo协议向注册中心发布服务:当服务提供方,向dubbo协议的注册中心发布服务的时候,是如何获取,创建注册中心的,如何注册以及订阅服务的,下面我们来分析其流程. 看如下配 ...

  7. HDU 1176 免费馅饼 (类似数字三角形的题,很经典,值得仔细理解的dp思维)

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1176 免费馅饼 Time Limit: 2000/1000 MS (Java/Others)     ...

  8. idea 和 maven学习

    创建maven项目:http://www.cnblogs.com/wql025/p/5215570.html

  9. FCC Truncate a string 解决方法

    三行搞定 function truncate(str, num) { ab = str.length >num?num>3?str.slice(0,num-3)+ "...&qu ...

  10. 原生js创建模态框

    1.效果图如下: 2.代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...