11 2018 档案
摘要：前端框架从MVC过渡到MVVM。从DOM操作到数据驱动，一直在不断的进步着，提升着， angular中用的是watcher对象，vue是观察者模式，react就是state了，他们各有各的特点，没有好坏之分，只有需求不同而选择不同。 今天就着重详细的随手写点我对react中state的理解： Rea
阅读全文
摘要：首先确保电脑和手机连接到同一个热点上 电脑连接热点以后，首先打开Charles设置Charles的setting port一般都默认8888 Enable transparent HTTP proxying 这个可以不勾选 设置好之后点击OK就可以了， 然后打开你的手机，连接同一个热点， 打开手机的
阅读全文
摘要：有多个项目目录的时候 由于项目不知一个，所以不得不为每一个项目建一个专有的文件夹，这就导致了在配置nginx的时候会出现二级目录 由于项目不知一个，所以不得不为每一个项目建一个专有的文件夹，这就导致了在配置nginx的时候会出现二级目录 - step1: 修改 vue.config.js 添加配置
阅读全文
摘要：错误的原因是缺少index.html或者index.php文件，就是配置文件中index index.html index.htm这行中的指定的文件 只需要配置时加一句 index index.html index.htm index.php
阅读全文
摘要：由于项目不知一个，所以不得不为每一个项目建一个专有的文件夹，这就导致了在配置nginx的时候会出现二级目录 目前找到的最简单的方法 - step1:修改 vue.config.js 添加配置 baseUrl: '/dist/', - step2:修改 router/index.js const ro
阅读全文
摘要：下面这张图可以完美的解释他们三者之间的关系 URI包含URL和URN Uniform Resource Identifier :统一资源标志符，用于标识某一互联网资源 Uniform Resoutce Location:通一资源定位符，用于表示资源的地点，它提供了一种互联网上任意资源的手段，也是浏览
阅读全文
摘要：虚拟DOM是最先由Facebook在react里使用的， 虚拟DOM是一个特别棒的概念，我们都知道，在浏览器上进行DOM操作的时候，会特别的消耗性能而且响应、渲染特别慢，但是有了虚拟DOM就不一样了， 虚拟DOM就是将DOM树转换成一个JS对象树， 虚拟DOM就是将上述的标签写成一个js对象树，如下
阅读全文
摘要：v-if与v-show的区别与选择 官网给的区别 v-if 是“真正”的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。 v-if也是惰性的：如果在初始渲染时条件为假，则什么也不做——直到条件第一次变为真时，才会开始渲染条件块。 相比之下，v-show 就简单得多—
阅读全文
摘要：typeof typeof 是一个操作符，其右侧跟一个一元表达式，并返回这个表达式的数据类型。 返回的结果用该类型的字符串(全小写字母)形式表示，包括以下 6 种： number、boolean、string、object、undefined、symbal 、function。 typeof 对于对
阅读全文
摘要：字符串属性及方法 .length 长度，只读 charAt(i) 获取字符串中i对应的字符，i是字符串的下标 charCodeAt(i) 获取字符串下标i对应的字符的ASCIII值 fromCharCode 将ASCII值转换为字符 indexOf(子字符串) 获取字符串当中，子字符串第一次出现的位
阅读全文
摘要：数组属性及方法 .length 数组长度 .reverse() 逆序输出 .push(v1,v2,...) 将v1,v2等添加到数组的末尾处，返回值为新的数组 .pop() 将数组最后一个元素删除，返回值为删除的那个元素 .unshift(v1,v2,...) 将v1,v2等添加到数组的开始位置，返
阅读全文
摘要：Vue: （1） 没有再模板里引用data数据，会不会引起update、beforeUpdate生命周期函数的执行？ 不会 （2）组件改成异步 （3）v-once （4）如果不用template属性，直接在页面上写组件名，有些浏览器会把这些非法命名的组件解析错误，这是需要在标签内写正常的标签名，写i
阅读全文
摘要：1、find 查询数组中符合条件的第一个元素，如果没有符合条件的元素则返回空数组 var arr = [1,2,3,4,5,6,7] var newarr=arr.find(v=>v===4) var men=[ {name:'zhangsan',age:'18',sex:'女'}, {name:'lisi',age:'10086',sex:'nan'}, {name:'xi...
阅读全文
摘要：以下内容均摘抄自react官网 React 和 ReactDOM 都可以在 CDN 上获得。 <script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script> <script crossor
阅读全文
摘要：在命令行里执行以上语句就可（前两天刚刚发现，最新版的react对webpack的版本要了新要求，大概是他新加的内容使用到了webpack高版本中的一些内容，所以使用时注意你的node版本和webpack版本，可能有一些版本要求） 就是这么的简单 ^-^ ^-^ 如果本文对您有帮助，请抬抬您的小手，点
阅读全文
摘要：这是官网上的一个简单的例子 从中可以看到： jsx 是可以在里面写js代码的， 在{ }里面写js代码 在这里我解释一下，为什么可以在react里的HTML标签里面的{}里写js代码 Babel 将JSX编译成 React.createElement() 调用。 而react就是运用了这个方法，例如
阅读全文
摘要：众所周知，vue在beforecreate时期是获取不到data中的 数据的 但是通过一些方法可以实现在beforecreate时获取到data中的数据 暂时想到两种放发可以实现，vue在beforecreate时获得data中的数据 异步获取即：通过 $this.$nextTick或者settim
阅读全文
摘要：vue点击时动态改变样式template中 data中 methods中 如果本文对您有帮助，请抬抬您的小手，点下右下角的推荐， ^-^，当然如果看了这篇博客对您有帮助是我最开心的事，毕竟赠人玫瑰，手有余香， ^-^，如果这篇博客没有帮助到您，那就只能说一声抱歉啦
阅读全文
摘要：其实在stylus与sass中实现移动端1像素线各个手机设备的适配问题的原理是一样的， 首先我还是先介绍一下原理和所依赖的方法 原理：其实他们都是通过css3的媒体查询来实现的 步骤思路： 1、给目标元素进行相对定位 2、给目标元素添加伪元素 ::after/before 并进行绝对定位 3、判断D
阅读全文
摘要：Vue 最独特的特性之一，是其非侵入性的响应式系统。数据模型仅仅是普通的 JavaScript 对象。而当你修改它们时，视图会进行更新。这使得状态管理非常简单直接 大家都知道vue的响应式原理是通过ES6新增的属性Object.defineProperty来实现的，在说vue响应式原理之前不得不先说
阅读全文
摘要：vue生命周期 vue生命周期分为八个阶段： 创建前后（组件初始化时期）， vue生命周期体系开始初始化，data和dom都还未初始化，无法访问 created时 可以访问到data，通常做一些数据的初始化动作，因为不会引起其他阶段的钩子函数重复执行 挂载前后（组件创建时期）， dom依然不可访问，
阅读全文
摘要：采用 数据劫持 + 发布-订阅 模式，通过Object.definePropety()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调 需要对observer的数据对象进行递归遍历，包括子属性对象的属性，都加上setter和getter ，这样，给这个对象
阅读全文
摘要：001、获取滚动条滚动的距离 var sTop = document.documentElement.scrollTop || document.body.scrollTop 002、获取非行间样式 IE： currentStyle[attr] 标准： getComputedStyle[attr]
阅读全文
摘要：异步获取即：通过 $this.$nextTick或者settimeout，这连dom都可以拿出来 beforeCreate() { this.$nextTick(function() { console.log(this.属性名); }) }) 同步获取：在beforeCreate之前，所有的ipt
阅读全文
摘要：当然详细情况还是看一下vue的官网吧 官网https://router.vuejs.org/zh/ hash模式下（默认） new VueRouter({ mode : ‘hash’, routes : [] }) window.addEventListener(‘hashchange’,方法名或方
阅读全文
摘要：未知宽高元素垂直居中 给父元素display:table;子元素display:cell-table,vertical-align:center，子元素即可居中 子元素绝对定位，top50%,left50%,transform:translate(50% 50%) 父元素flex， align-it
阅读全文
摘要：伪数组转换真数组的方法 声明一个空数组，通过遍历将他们添加到新的数组中去 1 //这个比较简单就不举例子啦~~ 使用数组的slice()方法，他返回的是数组，使用call或者apply指向伪数组 var arr = Array.prototype.slice.call(oldarr); 使用原型继承
阅读全文
摘要：循环时参数一定按顺序来，因为vue内部已经规定好了顺序 如果本文对您有帮助，请抬抬您的小手，点下右下角的推荐， ^-^，当然如果看了这篇博客对您有帮助是我最开心的事，毕竟赠人玫瑰，手有余香， ^-^，如果这篇博客没有帮助到您，那就只能说一声抱歉啦
阅读全文
摘要：在使用better-scroll的时候遇到过的错误之一[BScroll warn]: Can not resolve the wrapper DOM. Vue better-scroll[Vue warn]: Error in mounted hook: “TypeError: Cannot rea
阅读全文
摘要：LodashAPI总结 Lodash是一个特别特别好用的工具，感觉有了Lodash就没有解决不了的问题了~~~~ 使用初开始 官网 https://www.lodashjs.com/docs/4.17.5.html 安装 yarn add lodash npm install lodash 在js文
阅读全文
摘要：#call, apply, bind 区别及模拟实现call apply bind 三者都可以用来改变this的指向，但是在用法上略有不同 首先说一下call和apply的区别 call和apply都是第一个参数是this的指向 ，只是传参的方式不同 call是 第二个以及第三依次类推都是当前函数的
阅读全文
浙公网安备 33010602011771号