長期更新前端自學筆記,歡迎關注前端
我在淘寶作前端的這三年 — 第二年: vue
ps: 做者的文章有三篇,涉及第一至第三年。我是看了快半個多小時,收益匪淺。建議你們花上一點時間好好看看nginx
不管是職業發展,事業選擇,仍是生活的小事,是否值當的評判標準能夠加上一條:完整鏈路。canvas
好比:這個項目賺錢,而後不斷迭代,賺更多的錢,再迭代。。。循環下去。這就是個好的鏈路,是一個完整的閉環。 而壞的鏈路是:產品原型就行不通,硬把項目開發完,很顯然項目不賺錢,迭代後仍是不賺錢,慢慢就不了了之了,還落得一地雞毛。
你可能會想,這個有什麼,不就是雞湯嘛。segmentfault
其實否則,他的做用更大體如今事情發生以前,體如今未雨綢繆。當咱們作決策的時候,是須要綜合各方信息,並結合將來的走勢綜合去判斷。api
有了完整聯絡的思想,能夠把將來竄起來。若是這個鏈路是通的,說明這個方案(或者想法。。)的可行性比較高。若是初期鏈路預想都不通,那是否去作去執行,就要打上大大的問號。框架
我最近也用在本身身上dom
CreateJS入門 -- 註釋詳細到爆炸(My Style)post
官網API學習
公司偏動效開發,而熱門產品的動效使用的正是createJs技術。本身也很快要開發相似產品,相關的技術也要學起來,做爲儲備。
經過兩三個早上的學習,createJs學起來仍是比canvas簡單,畢竟他跟vue框架同樣是封裝好的,調取api便可。
本次學習createJS不一樣以往,以前主要是跟着別人的思路走:要麼是純教程或者視頻。而跟着別人走,雖然看似節省時間,但對於技術的總體脈絡會比較片面,只是掌握了教材中教的技術而已。
此次主要是看官方的文檔,再去整理筆記,不斷消化主要的api。這種學習方式比上面的效率反而更高,學習方式也是可持續的。
固然這種學習方法也是有前提的,最好是官網文檔比較齊全,入門教容易的,太難的仍是其餘的方法吧。
<template> <div class="content" ref='mobileRef'> // 固定高度 <div class='content-scroll' ></div> </div> </template> <script> data () { return { once: true } }, mounted() { // 監聽頁面內div元素滾動條 // this.$refs.mobileRef.addEventListener('scroll', ()=>{ // console.log('scrollHeight', this.$refs.mobileRef.scrollHeight) // if(this.form.backgroundImg) { // this.$refs.mobileRef.scrollTop = this.$refs.mobileRef.scrollHeight // } // console.log(" scroll " + this.$refs.mobileRef.scrollTop) // }, false) this.$nextTick(function () { window.addEventListener('scroll', this.onScroll) // 監聽滾動條 }) }, methods: { onScroll () { let that = this let scrolled = document.documentElement.scrollTop || document.body.scrollTop // 獲取滾動條srcollTop let step = '' if(this.form.backgroundImg) { let divHeight = that.$refs.mobileRef.scrollHeight // 左側元素的滾動條高度 let divClient = that.$refs.mobileRef.clientHeight // 滾動條自己的高度 step = divHeight/50 // 平滑滾動,設置了50,後面設置定時器,每10秒變化一次 if(scrolled <705 && this.once == false ) { // once鎖必定要是全局的,不能設置在方法onScroll中 smoothUp() } else if(scrolled >710 && this.once == true) { // 爲了造成互斥效果,兩邊都須要判斷scrolled的高度,以及互斥鎖 smoothDown() } function smoothDown() { if(that.$refs.mobileRef.scrollTop <divHeight-divClient) { // divHeight-divClient 就是srcollTOP的最大高度 that.$refs.mobileRef.scrollTop += step // 遞歸,會一直調用,直到return false .遞歸的出口是:that.$refs.mobileRef.scrollTop =divHeight-divClient setTimeout(smoothDown, 10) } else { setTimeout(()=>{ // 鎖設置了定時器,主要是爲了防止scrolled 在710的節點出現快速上下滑動出現的抖動行爲 that.once = false }, 200 ) } } function smoothUp() { if(that.$refs.mobileRef.scrollTop > 0) { that.$refs.mobileRef.scrollTop -= step setTimeout(smoothUp, 10) // 遞歸的出口是:that.$refs.mobileRef.scrollTop = 0 } else { setTimeout(()=>{ that.once = true }, 200 ) } } } } } </script>