3.0アルファは、2は:2:携帯アプリのコア機能

最後に、3.0アルファのこの機能を引っ張るために私を助けてくれてありがとう.

ポストの取得

これは私の初めてですが、APIやサービスからデータを取得する素晴らしい練習があります.私は、私が我々のリードをしたい唯一の理由を推測しますmobile アプリはまた、地面からも物事を行う方法を学びます.当社のWeb上での作業は、既存のシステムに物事を学び、統合する別のものであった.一方、私たちの携帯アプリで私はチャンスをゼロから学ぶチャンスを得た.私にとって幸運な私は自分で研究する必要はありませんでした.この問題のために、私は多くの時間を費やして、彼がものを実行する方法を目撃することができます、そして、彼は私の仕事の流れに本当に良い提案をしました、そして、私が問題に取り組むことができる方法と私が彼の知識に基づいて改善することができる方法.我々は、我々を見ますPost.tsx and Timeline.tsx 以前の学期でこれに取り組んだPPLSが我々のウェブのためによく実装されたdisplingしているポストを持っているところ.使い方を学ぶswr and SWRInfinite 設定と同様にfetcher トップレベルでどのように表示するswr データを振る舞う.

スクロールリストの代わりにフラットリストを使う

私たちは投稿を表示する作業中.我々は、我々が何をしていたとしても、適切にスクロールする我々のscollviewのために苦労していますreact native Docは提案し、多くのスタイルを変更するflex and flexGrow 画面の高さを指定するScrollView スクロールする.私がDOCを読むとき、彼らも言及しますFlatList これは、アプリケーションのパフォーマンスを向上させるために怠惰な読み込みがあります.あなたがより多くをスクロールして、メモリ空間の効率的な使用のために上記の項目を削除するとき、それはコンポーネントだけをロードするでしょう、そして、使用は単純です.からの我々のフェッチされたオブジェクトpost service - nestedオブジェクトを返します.map それに2回のメソッド.フラットリストを使用するだけでmap 一度

<FlatList
        data={pages}
        renderItem={renderPost}
        keyExtractor={(item, index) => index.toString()}
      />

コンポーネントのスタイル設定

それから、我々はポスト表示の後、難しい時間を持ちます.彼らは、醜くて質素に見えます.以来react native ノーマルを持っていないhtml 我々が我々のものをすることができないように、我々のものtelescope-post-content.css です.幸運なデュークスポットreact-native-render-html これらの要素を使用してスタイルに支柱を通過させてくださいtagsStyles . 今、私はまだ携帯電話のバージョンのために完全に動作するようにCSSを変更するに取り組んでいますが、私たちはそれをオフにプルし、どのように問題に取り組んで学ぶことができることがうれしいです私のための良い学習機会をされている.
デュークは私たちが異なった方法をしなければならなかったことを言いました、そして、我々のprofは我々が我々のワークフローを最も簡単なものからアプリの中心的な機能から働くように最初から働くことから我々のワークフローを動かすことが我々にとって完璧であることを我慢するのを我々に話すようにしようとするものを言いました.私の経験のようにBanner スクロールをするのも難しいし、バナーを実装する前にポストをロードする実装をしなければならない
マイPR