資訊專欄INFORMATION COLUMN
摘要：雙嘆號強制類型轉(zhuǎn)換為布爾值。官方示例代碼用注冊了全局組件，會把自動注冊為屬性，所以沒有手動寫屬性。如果對象是響應的，將觸發(fā)視圖更新。這是用來布爾值，又學了一招和分別代表單擊和雙擊事件綁定。
如果覺得有幫助，歡迎 star哈~
https://github.com/jiangjiu/blog-md/issues/11感謝作者 @尤小右 大大邊寫的超級帶感的 Vue.js 前端框架，贈送的幾個小例子都很有代表性，代碼邏輯清晰簡明，不禁想抄上一抄嗯。
官方的示例都是 ES5直接編寫運行，并沒有使用ES6以及構(gòu)建工具，考慮到以后開發(fā)大一些的項目以及官方出品的 vue-cli腳手架，決定這次學習之旅采用兩者結(jié)合寫寫官方的示例。
初探步驟：
觀摩示例的 result
思考組件模板和邏輯實現(xiàn)思路
遇到問題先搜一下 api 和官方教程（好像看過一遍還是記不住什么。。。結(jié)合實踐重要嗯）
還是不會就看例子的代碼吧（不出意外的話都會走到這步哈哈）
整理一下代碼和總結(jié)
markdown Editor一個極簡的 markdown 編輯器，用了 marked 這個工具。
新建一個 Marked 組件就 ok?？雌饋砗芎唵危瑃extarea 標簽作為輸入編輯器，另一個 div 標簽通過 marked 這個 markdown工具 轉(zhuǎn)碼。
npm i marked --save 來安裝好 marked，import 后通過定義過濾器實現(xiàn)。
textarea 設置了 debounce指令。debounce 設置一個最小的延時，在每次敲擊之后延時同步輸入框的值與數(shù)據(jù)。如果每次更新都要進行高耗操作（例如在輸入提示中 Ajax 請求），它較為有用。
github commits
編寫一個小組件，異步獲取 github 的兩條 branch的數(shù)據(jù)。
created:生命周期的鉤子，在實例創(chuàng)建后同步調(diào)用。此時實例已經(jīng)結(jié)束解析選項，意味著已經(jīng)建立了數(shù)據(jù)綁定，計算屬性，方法，watcher/事件回調(diào)。但是還沒有開始 DOM 編譯，$el 還不存在。
watch：一個對象，鍵是觀察表達式，值是對應回調(diào)。值也可以是方法名，或者是對象，包含選項。在實例化時為每個鍵調(diào)用 $watch() 。
遇到的問題：eslint 總是提示 new XMLHttpRequest() 錯誤，not defined，并不知道為啥會這樣，看到了很多代碼也并沒出錯啊，暫時在 eslint 的配置文件把 no-undef 設為0忽略它了，如果有知道的童鞋可以指點一二。
Validation+FirebaseLatest vue.js Commits
vuejs/vue@{{currentBranch}}
- dd - {{record.commit.message}} by {{record.commit.author.name}} at {{record.commit.author.date}}
firebase 實時后端云簡單摟了一眼，號稱無后端數(shù)據(jù)存儲加實時通信還是很帶感的，不過自己寫的時候總是報錯，只好自己在本地 mock 一下了。以后寫可以使用 wilddog，國內(nèi)的
計算屬性：由于模板中只可以用表達式，相對復雜的邏輯并不適合放在模板中，所以計算屬性就派上用場了，簡單易用。計算屬性默認只是 getter 函數(shù)，不過也可以自定義 getter 和 setter函數(shù)。
transition 過渡：這個過渡系統(tǒng)聽勾股大大說很值得學習，所以暫時放下以后看源碼先。
mock 數(shù)據(jù)對象以后比較蛋疼，會把 newUser這個對象直接 push 進 userRef 中，導致以后對 newUser 的操作都會被雙向綁定顯示到列表中。。。所以只好深拷貝一下數(shù)據(jù) push 進去，這個留坑以后填。
!!:雙嘆號強制類型轉(zhuǎn)換為布爾值。
樹狀視圖
- {{user.name}} - {{user.email}}
Name can not be empty
email is not validated
這個例子實現(xiàn)了樹狀視圖，主要演示如何遞歸調(diào)用組件。
遞歸組件：組件在自身的模板內(nèi)可以遞歸調(diào)用自己，但是要有 name 選項才可以，在這上面花了好長時間又去查了教程才發(fā)現(xiàn)。。。官方示例代碼用 Vue.component()注冊了全局組件，會把 id 自動注冊為name 屬性，所以沒有手動寫 name 屬性。我在 cli 里寫的時候一直沒注意，導致遞歸總是不顯示嗯。
Vue.set:全局 API，設置對象的屬性。如果對象是響應的，將觸發(fā)視圖更新。這個方法主要用于解決不能檢測到屬性添加的限制。
open = !open:這是用來 toggle 布爾值，又學了一招~
@click和@dblclick分別代表單擊和雙擊事件綁定。后一個還真是沒注意過。
動態(tài) props：可以綁定 props，這樣父組件數(shù)據(jù)變化后，也會傳遞給子組件。
- +
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/79850.html
摘要：最近得閑，想總結(jié)總結(jié)最近在學習上的一些心得，畢竟作為新手多寫多練好處多多，話不多說，馬上開始前端工程化為開發(fā)帶來了很多便利，但實際是，環(huán)境的配置也要大費周章一番。 最近得閑，想總結(jié)總結(jié)最近在學習Vue上的一些心得，畢竟作為新手多寫多練好處多多，話不多說，馬上開始！ 前端工程化為開發(fā)帶來了很多便利，但實際是，環(huán)境的配置也要大費周章一番。我用的是在Node環(huán)境下基于webpack來編譯打...
摘要：前言月份開始出沒社區(qū)，現(xiàn)在差不多月了，按照工作的說法，就是差不多過了三個月的試用期，準備轉(zhuǎn)正了一般來說，差不多到了轉(zhuǎn)正的時候，會進行總結(jié)或者分享會議那么今天我就把看過的一些學習資源主要是博客，博文推薦分享給大家。 1.前言 6月份開始出沒社區(qū)，現(xiàn)在差不多9月了，按照工作的說法，就是差不多過了三個月的試用期，準備轉(zhuǎn)正了！一般來說，差不多到了轉(zhuǎn)正的時候，會進行總結(jié)或者分享會議！那么今天我就...
摘要：三輪技術面上一輪發(fā)揮感覺沒前兩輪發(fā)揮好，所以還是有點不自信的，沒想到第三天后，就來電話了，通知我去阿里園區(qū)面試。 一般阿里社招都是招3-5年的P6+高級工程師，當初自己一年經(jīng)驗也沒有想過有這個面試機會。 雖然沒想著換工作，但是經(jīng)常關注一些招聘網(wǎng)站的信息，某一天，在某boss上有個人找我，叫我發(fā)一下簡歷，我一看是阿里的某技術專家，雖然之前也有阿里的在某boss上給我要簡歷，但是我深知自己...
閱讀 2837·2021-09-28 09:45
閱讀 1510·2021-09-26 10:13
閱讀 905·2021-09-04 16:45
閱讀 3665·2021-08-18 10:21
閱讀 1092·2019-08-29 15:07
閱讀 2637·2019-08-29 14:10
閱讀 3150·2019-08-29 13:02
閱讀 2465·2019-08-29 12:31
