Vue 数组封装和组件data定义为函数一些猜测
数组封装
- 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定义为函数一些猜测的更多相关文章
- Vue文件封装日历组件
封装就是要具有灵活性,样式自适应,调用的时候传入props就可以变成自己想要的样式. 效果展示网址:https://1963331542.github.io/ 源代码: <template> ...
- Vue 组件 data为什么是函数?
在创建或注册模板的时候,传入一个data属性作为用来绑定的数据.但是在组件中,data必须是一个函数,而不能直接把一个对象赋值给它. Vue.component('my-component', { t ...
- Vue 组件 data为什么是函数
在创建或注册模板的时候,传入一个data属性作为用来绑定的数据.但是在组件中,data必须是一个函数,而不能直接把一个对象赋值给它. Vue.component('my-component', { t ...
- Vue自行封装常用组件-弹出框
使用方法: 1.在父组件中引入"box.vue" //import popUpBox from "./box.vue"; 2.在父组件中注册 popUpBo ...
- [ vue ] Quasar封装q-dialog组件,在外层实现弹出框的开启和关闭
场景描述: 见:https://www.cnblogs.com/remly/p/12981582.html 具体实现: <!-- 父组件 --> <template> < ...
- Vue自行封装常用组件-倒计时
倒计时组件,比较复杂一点,大神勿调侃,精确到毫秒,因为项目中多次出现倒计时,所以拿出来分享下 使用方法:1.在父组件中引入"uni-countdown" //import uniC ...
- Vue自行封装常用组件-文本提示
使用方法:1.在父组件中引入"toast.vue" //import toast from "./toast"; 2.在父组件中注册 toast //compo ...
- Vue中封装axios组件实例
首先要创建一个网络模块network文件夹 里面要写封装好的几个组件 在config.js里面这样写 在index.js要这样写 core.js文件里面内容如下 然后要在main.js文件里面要设置 ...
- vue中封装swipe组件
<template> <!-- TODO swipe --> <div id="hy-swiper"> <div class=" ...
随机推荐
- Asp.Net Core + Ocelot 网关搭建:路由简单配置
前言 Ocelot是一个基于中间件的网关实现,功能有很多.从浅入深简单学习并记录一下吧.本篇就是一个简单的路由配置实现. DEMO 搭建 首先建立三个项目.Api.User,Api.Artic ...
- Spring(五)之Bean定义继承和依赖注入
一.Bean定义继承 bean定义可以包含许多配置信息,包括构造函数参数,属性值和特定于容器的信息,例如初始化方法,静态工厂方法名称等. 子bean定义从父定义继承配置数据.子定义可以根据需要覆盖某些 ...
- HDU 1272小希的迷宫(裸并查集,要判断是否构成环,是否是连通图)
题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1272 小希的迷宫 Time Limit: 2000/1000 MS (Java/Others) ...
- flashcache中内存与磁盘,磁盘与磁盘的io
flashcache中跟磁盘相关的读写分为以下两类: 1)磁盘跟内存的交互 2)磁盘跟磁盘之前的交互 比如说读不命中时就是直接从磁盘读,属于第1种情况,那读命中呢?也是属于第1种情况,不过这时候是从S ...
- 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 ...
- Java接口和抽象类详解
父类定义了相关子类的共有属性和行为.而接口可以定义类的共同行为(包括非相关的类). 了解接口前,先来说说抽象类.抽象类介乎于普通类和接口之间,提供部分实现方法以及未实现方法,可以看作为一个半成品. 抽 ...
- node.js中用户密码的加密
crypro实现用户密码的加密 在实际的项目中,只要涉及到用户的信息,就是十分重要的.设想一下数据库里面存放的用户的密码是明文的形式,后果是有多严重.所以今天给大家分享一下express中怎样实现用户 ...
- ABAP术语-V2 Module
V2 Module 原文:http://www.cnblogs.com/qiangsheng/archive/2008/03/21/1115720.html Analogously to V1 the ...
- MySQL语句详解(用户表、密码、权限、远程)
注: mysql.user表中Host为%的含义 Host列指定了允许用户登录所使用的IP,比如user=root Host=192.168.1.1.这里的意思就是说root用户只能通过192.168 ...
- ORACLE->SQL*Loader[20180712]
https://docs.oracle.com/cd/B28359_01/server.111/b28319/ldr_concepts.htm#g1013706 SQL*Loader将外部 ...