国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

taro的坑：子組件的默認(rèn)屬性和父組件中修改子組件樣式問(wèn)題以及應(yīng)用復(fù)雜數(shù)據(jù)

Cristalven / 1624人閱讀

摘要：我們需要在子組件內(nèi)這樣定義默認(rèn)屬性坑二父組件中修改子組件樣式如果子組件在多個(gè)地方用，那么就需要在不同地方展示不同的子組件樣式，所以就需要在父組件中修改樣式。現(xiàn)在我們終于可以在父組件用作為來(lái)修改子組件的樣式了。

坑一：子組件的默認(rèn)屬性

如果這樣獲取可選屬性的默認(rèn)值：

    const { startScore = 0, currentScore = 0, endScore = 0, showStartAndEnd = true } = this.props;

而又沒(méi)有實(shí)際傳入屬性的話頁(yè)面中就會(huì)顯示null。我們需要在子組件內(nèi)這樣定義默認(rèn)屬性：

  static defaultProps = {
    currentScore: 0,
    startScore: 0,
    showStartAndEnd: true,
    endScore: 0,
  };

坑二：父組件中修改子組件樣式

如果子組件在多個(gè)地方用，那么就需要在不同地方展示不同的子組件樣式，所以就需要在父組件中修改樣式。而taro不能像react那樣直接修改，而是需要這樣麻煩的步驟：

先在子組件中定義有哪些拓展的class：

  static externalClasses = ["my-class", "radio-class", "img-class", "info-class", "add-class", "count-class", "delete-class"];

再將拓展的class應(yīng)用到子組件樣式可變的地方：

如圖中的radio-class

之后在父組件中應(yīng)用對(duì)應(yīng)的將對(duì)應(yīng)的class作為屬性傳輸：

如圖中的radio-class。現(xiàn)在我們終于可以在父組件用Goods-radio作為className來(lái)修改子組件的樣式了。

坑三

如果你想在JSX中使用復(fù)雜的數(shù)據(jù)結(jié)構(gòu)，如mobx的數(shù)組，最好在用將數(shù)組復(fù)制，然后使用復(fù)制體。不然可能會(huì)不更新。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/109776.html

相關(guān)文章

  • Taro 簡(jiǎn)介

    摘要：讓人又愛(ài)又恨的微信小程序自微信小程序以下簡(jiǎn)稱小程序誕生以來(lái)，就伴隨著贊譽(yù)與爭(zhēng)議不斷。同時(shí)于開(kāi)發(fā)者來(lái)說(shuō)，小程序的生態(tài)不斷在完善，許多的坑已被踩平，雖然還是存在一些令人詬病的問(wèn)題，但已經(jīng)足見(jiàn)微信的誠(chéng)意了。 Taro 介紹 在互聯(lián)網(wǎng)不斷發(fā)展的今天，前端程序員們也不斷面臨著新的挑戰(zhàn)，在這個(gè)變化多端、不斷革新自己的領(lǐng)域，每一年都有新的美好事物在發(fā)生。從去年微信小程序的誕生，到今年的逐漸火熱，以及...

    sixgo 評(píng)論0 收藏0

  • React的移動(dòng)端和PC端生態(tài)圈的使用匯總

    摘要：調(diào)用通過(guò)注冊(cè)表調(diào)用到實(shí)例，透過(guò)的，調(diào)用到中的，最后通過(guò)，調(diào)用，根據(jù)參數(shù)相應(yīng)模塊執(zhí)行。京東的，多端解決方案是一套遵循語(yǔ)法規(guī)范的多端開(kāi)發(fā)解決方案。 showImg(https://segmentfault.com/img/bVbuMkw?w=1304&h=808); 對(duì)于一項(xiàng)技術(shù)，我們不能停留在五分鐘狀態(tài)，特別喜歡一句話，用什么方式繪制UI界面一點(diǎn)不重要，重要的是底層的思維，解決問(wèn)題和優(yōu)化...

    kun_jian 評(píng)論0 收藏0

  • React的移動(dòng)端和PC端生態(tài)圈的使用匯總

    摘要：調(diào)用通過(guò)注冊(cè)表調(diào)用到實(shí)例，透過(guò)的，調(diào)用到中的，最后通過(guò)，調(diào)用，根據(jù)參數(shù)相應(yīng)模塊執(zhí)行。京東的，多端解決方案是一套遵循語(yǔ)法規(guī)范的多端開(kāi)發(fā)解決方案。 showImg(https://segmentfault.com/img/bVbuMkw?w=1304&h=808); 對(duì)于一項(xiàng)技術(shù)，我們不能停留在五分鐘狀態(tài)，特別喜歡一句話，用什么方式繪制UI界面一點(diǎn)不重要，重要的是底層的思維，解決問(wèn)題和優(yōu)化...

    J4ck_Chan 評(píng)論0 收藏0

  • React的移動(dòng)端和PC端生態(tài)圈的使用匯總

    摘要：調(diào)用通過(guò)注冊(cè)表調(diào)用到實(shí)例，透過(guò)的，調(diào)用到中的，最后通過(guò)，調(diào)用，根據(jù)參數(shù)相應(yīng)模塊執(zhí)行。京東的，多端解決方案是一套遵循語(yǔ)法規(guī)范的多端開(kāi)發(fā)解決方案。 showImg(https://segmentfault.com/img/bVbuMkw?w=1304&h=808); 對(duì)于一項(xiàng)技術(shù)，我們不能停留在五分鐘狀態(tài)，特別喜歡一句話，用什么方式繪制UI界面一點(diǎn)不重要，重要的是底層的思維，解決問(wèn)題和優(yōu)化...

    Travis 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<