Trailhead 官方 LWC trailmix 解讀之 Lightning Web Components for Aura Developers (純凈版)

寫在前面的話

也許很多同學(xué)還不是很了解什么是aura ? 簡單講 aura 就是在 LWC 之前用來做 Lightning 前端開發(fā)的框架。所以標(biāo)題可以理解為:寫給老一輩 Lightning 前端開發(fā)者的 LWC 介紹犹菱。各位同學(xué)要有心理準(zhǔn)備朗儒,這個 module 是很冷血颊乘,殘酷的一個 module,但同時也是整個 trail 里唯一達(dá)到 Trailhead 標(biāo)準(zhǔn)的一個 module醉锄。所以無論你是否是老一輩的 Lightning 開發(fā)人員乏悄,這個 module 都不應(yīng)該錯過。只是提醒下,如果其中很多關(guān)于 aura 的概念你不清楚恳不,簡單了解下就好不需要深究了檩小,原因馬上告訴你。

Unit 1:Understand How Lightning Web Components Work with Aura Components

“理解 LWC 如何與 Aura 組件一起工作”烟勋,哼规求!這種虛偽的標(biāo)題在第一段就撕掉了偽善的面具露出了冷血的現(xiàn)實(shí)。章節(jié)開始作為老一輩Lightning 開發(fā)者不禁要問:“馬克班尼奧夫同志卵惦,我剛花了兩年時間才學(xué)會了Aura阻肿,你就推個新 LWC 框架,做一模一樣的的事情沮尿!你幾個意思按运?” 然后官方給出的答復(fù)是:“在創(chuàng)世之初,并沒有意識到 JS 的星星之火可以燎原成這個樣子赴邻。當(dāng)前 ES6 ES7 的出現(xiàn)基本統(tǒng)一了 JS 的標(biāo)準(zhǔn)印衔。所以我們推出了基于最新 JS 標(biāo)準(zhǔn)的新 LWC 組件。讓全世界前端受苦受難的人都可以翻身得解放乍楚。'Do you hear the people sing? Singing a song of angry men?It is the music of a people who will not be slaves again! '” 恩当编,你還能怎么辦呢?
接下來 unit 就開始介紹 LWC 的好處:What Are the Benefits of Lightning Web Components?

  • 更現(xiàn)代的 javascript
  • 開發(fā)效率和滿意度的提升
  • 代碼性能
    后面需要特別提到了一段就是“Buckle Up for a Journey”徒溪,這段描寫非常有 trailhead 的調(diào)調(diào)。

Learning any new programming model or language is a journey. When you get some new code running, it can feel like the thrill of driving a convertible on an open road. Then you change a line of code and you get an error. You slam on the brakes, but you’ve hit a traffic jam and you desperately search for the next exit. Remember, it’s a journey. The error is just a temporary slowdown, and you’ll get to your destination in the end... hopefully, before dinner time.
We hope that this module prepares you for your Lightning web components journey. Think of the module as packing your suitcase for your trip. We step you through everything you need for the adventure. When you reach your destination, we don’t want you to open your suitcase and realize that you forgot to pack any underwear!

接著介紹新舊開發(fā)框架的合作模式:在 aura 組件中可以嵌套 LWC 組件金顿,但反過來不可以臊泌。有沒有感到一絲不安?這分明就是斷了aura 組件的后路揍拆。unit 的最后甚至給出了從 aura 到 LWC 的遷移的建議渠概。至此你應(yīng)該能看清 aura 要被拋棄的悲慘命運(yùn)了吧? 多么的殘酷嫂拴,之前還叫人家小甜甜播揪,現(xiàn)在倒好說放棄就放棄,不留一絲牽掛筒狠。

unit 2 & unit 3 遷移markup猪狈,CSSjavascript

后續(xù)的兩個 unit 就是搬家指南了,幫助老一輩的 auro 開發(fā)能更快的了解 aura 和 LWC 的差異辩恼,以及如果從 aura 遷移到 LWC雇庙。即使你沒學(xué)過 aura,你也可以當(dāng)作一份有對比的學(xué)習(xí)手冊灶伊,還是會提供很多關(guān)于 LWC 的知識點(diǎn)疆前,而且通過和 aura 的對比,你能更清晰的體會到 LWC 新框架帶來的便利與簡化聘萨。

Dynamic content in a Lightning web component’s HTML file doesn’t have quotes around the {brokerId} reference. It’s not a typo!

針對 JS 的遷移竹椒,可以發(fā)現(xiàn) aura 之前很多自定義的組件屬性和邏輯都被更標(biāo)準(zhǔn)和現(xiàn)代的 js 方式方法所替代∶追基本一個學(xué)過 react 的前端可以很容易的無痛上手 LWC 組件胸完。

unit 4: Use JavaScript API Methods to Write Data

這個Unit 主要介紹前端與后端的不同交互方式,包括表單組件儡循,@wire 注釋方式舶吗,直接請求 API 等,如果你對 salesforce 前后端交互方式不是很清楚择膝,這個 Unit 能給你跟多幫助誓琼。

unit 5:創(chuàng)建組件 Compose Components

這個Unit非常有用,介紹了組件間的集中關(guān)系,以及 LWC 事件綁定的機(jī)制腹侣。最后還介紹了 slot叔收。所有這些對于以后理解 LWC 組件都回有很大幫助。

unit:6 事件通訊 Communicate with Events

所有現(xiàn)代的 js 組件都會引入自己的事件機(jī)制傲隶。隨著js 標(biāo)準(zhǔn)的發(fā)展饺律,事件處理也已經(jīng)趨于標(biāo)準(zhǔn)。 LWC 組件支持單項數(shù)據(jù)響應(yīng)流程跺株,而 aura 則是支持雙向复濒。這個 unit 還把發(fā)布/訂閱方式的事件加入到 LWC 中,供組件間交換數(shù)據(jù)乒省。很酷不是嗎巧颈?

寫到最后

困的不行了,碼字守夜先到這里袖扛。明顯我的這篇文字也是虎頭蛇尾砸泛,豬年合家快樂健康。

LWC 系列文章

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末蛆封,一起剝皮案震驚了整個濱河市唇礁,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌惨篱,老刑警劉巖盏筐,帶你破解...
    沈念sama閱讀 211,817評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異妒蛇,居然都是意外死亡机断,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,329評論 3 385
  • 文/潘曉璐 我一進(jìn)店門绣夺,熙熙樓的掌柜王于貴愁眉苦臉地迎上來吏奸,“玉大人,你說我怎么就攤上這事陶耍》芪担” “怎么了?”我有些...
    開封第一講書人閱讀 157,354評論 0 348
  • 文/不壞的土叔 我叫張陵烈钞,是天一觀的道長泊碑。 經(jīng)常有香客問我,道長毯欣,這世上最難降的妖魔是什么馒过? 我笑而不...
    開封第一講書人閱讀 56,498評論 1 284
  • 正文 為了忘掉前任,我火速辦了婚禮酗钞,結(jié)果婚禮上腹忽,老公的妹妹穿的比我還像新娘来累。我一直安慰自己,他們只是感情好窘奏,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,600評論 6 386
  • 文/花漫 我一把揭開白布嘹锁。 她就那樣靜靜地躺著,像睡著了一般着裹。 火紅的嫁衣襯著肌膚如雪领猾。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,829評論 1 290
  • 那天骇扇,我揣著相機(jī)與錄音摔竿,去河邊找鬼。 笑死匠题,一個胖子當(dāng)著我的面吹牛拯坟,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播韭山,決...
    沈念sama閱讀 38,979評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼冷溃!你這毒婦竟也來了钱磅?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,722評論 0 266
  • 序言:老撾萬榮一對情侶失蹤似枕,失蹤者是張志新(化名)和其女友劉穎盖淡,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體凿歼,經(jīng)...
    沈念sama閱讀 44,189評論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡褪迟,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,519評論 2 327
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了答憔。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片味赃。...
    茶點(diǎn)故事閱讀 38,654評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖虐拓,靈堂內(nèi)的尸體忽然破棺而出心俗,到底是詐尸還是另有隱情,我是刑警寧澤蓉驹,帶...
    沈念sama閱讀 34,329評論 4 330
  • 正文 年R本政府宣布城榛,位于F島的核電站,受9級特大地震影響态兴,放射性物質(zhì)發(fā)生泄漏狠持。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,940評論 3 313
  • 文/蒙蒙 一瞻润、第九天 我趴在偏房一處隱蔽的房頂上張望喘垂。 院中可真熱鬧甜刻,春花似錦、人聲如沸王污。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,762評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽昭齐。三九已至尿招,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間阱驾,已是汗流浹背就谜。 一陣腳步聲響...
    開封第一講書人閱讀 31,993評論 1 266
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留里覆,地道東北人丧荐。 一個月前我還...
    沈念sama閱讀 46,382評論 2 360
  • 正文 我出身青樓,卻偏偏與公主長得像喧枷,于是被迫代替她去往敵國和親虹统。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,543評論 2 349

推薦閱讀更多精彩內(nèi)容