Warden's Life

This blog , made with love.

关于生态保护

救救这座美丽的山村吧

这里是浙江省衢州市太真乡,一片我自幼生长的土地。我深深爱着这里的一山一水、一草一木。然而,过去十余年间,我却眼睁睁看着这个本应美丽安静的小山村,这片曾经承载着无限希望与未来的家园,逐渐被破坏,走向衰败。 乡里的这座矿山,成为了我们无数居民挥之不去的梦魇。晴天,道路上灰尘漫天,遮天蔽日;雨天,泥泞不堪,行路难行。这样的生活每一天都在折磨着塔太线沿线的村民,而这一切似乎无人能管、无人愿管。...

透彻掌握Promise要点

Promise的重要性我认为我没有必要多讲,概括起来说就是必须得掌握,而且还要掌握透彻。这篇文章的开头,主要跟大家分析一下,为什么会有Promise出现

在实际的使用当中,有非常多的应用场景我们不能立即知道应该如何继续往下执行。最重要也是最主要的一个场景就是ajax请求。通俗来说,由于网速的不同,可能你得到返回值的时间也是不同的,这个时候我们就需要等待,结果出来了之后才知道怎么样继续下去。 // 简单的ajax原生实现 var url = 'https://hq.tigerbrokers.com/fundamental/finance_ca...

React笔记之改变函数作用域

如何改变函数作用域-bind this

问题 对于大多数前端开发来说,JavaScript 的 this 关键字会造成诸多困扰,由于 JavaScript 代码中的 this 指向并不清晰。在写react应用时,也会也到很多作用域绑定引起的问题,React组件ES6的写法,不会将方法内部的作用域自动绑定到组件的实例上。 下面展示一段问题代码 class Search extends Component { stati...

React笔记之JSX

JSX一些需要注意的点

属性扩散 有时候你需要给组件设置多个属性,你不想一个个写下这些属性,或者有时候你甚至不知道这些属性的名称,这时候 spread attributes 的功能就很有用了。 比如: var props = {}; props.foo = x; props.bar = y; var component = <Component {...props} />; props 对象的...

一个最简单的图片懒加载

阐释了懒加载是如何实现的

普通的懒加载是如何实现的? 懒加载的思路其实很简单,刚开始的时候不把图片的真实路径绑到单个<img>标签上,事先需要在这个标签上加上类似于data-src的属性,把真实的图片源绑定到这个上面。之后遍历整个DOM树,找到所有的<img>,判断该DOM元素是否在当前滚动的可见区域内,监听滚动事件,如果图片即将进入可视区,则把真实的图片源绑定到该src上 <scr...

关于几个数组去重整理

值得收藏

编写一个方法去掉一个数组的重复元素 (数组去重) var arr = ["呵呵","太真","太真","呵呵","Kathleen","Kathleen"]; // 方法1: 思路:定义一个新数组,遍历老数组,判断,如果新数组里面没有老数组的元素就添加,否则就不添加; var newArr = []; //遍历老数组 arr.forEach(function (ele,index...

解决微信小程序跳转重复点击

项目中微信小程序的跳转如果快速点击两次会重复跳转

点击事件是页面跳转 当点击事件是页面跳转时,不太适合显示加载框,但小程序的页面跳转并不是很快,如果不作处理又会导致用户反复点击打开多个页面,这里可以使用限制按钮或控件的点击间隔的方式处理,同样可以将这个方法放到公共的代码里面比如util,然后在使用时直接调用即可。 function buttonClicked(self) { self.setData({ ...

双向绑定的原理

几种实现双向绑定的做法

双向绑定原理 目前几种主流的mvc(vm)框架都实现了单向数据绑定,而我所理解的双向数据绑定无非就是在单向绑定的基础上给可输入元素(input、textare等)添加了change(input)事件,来动态修改model和 view,并没有多高深。所以无需太过介怀是实现的单向或双向绑定。 实现数据绑定的做法有大致如下几种: 发布者-订阅者模式(backbone.j...

VUE倒计时组件

一个vue的小组件,可用在订单有效期相关处

VUE倒计时组件 <template> <span v-cloak class='orange'></span> </template> <script> export default{ data(){ return { // time: '',...