ユニアプリとネイティブアプレットとvueの違い

WeChat アプレットとユニアプリの違い

  • タッチイベント名:
    ①WeChatアプレット:bindtap
    ②ユニアプリ:@click
  • 関数パラメータの受け渡し方法:
    ①WeChatアプレット:<view bindtap="click" data-id="id"></view>
    ②uni-app:<view @click="click(id)"></view>
  • 関数はパラメータを受け取ります:
    ①WeChat アプレット: function(e){this.setData(currentId:e.currentTarget.dataset.id)}
    ②uni-app:function(id){ this.currentId = id}
  • for ループ:
    ①WeChat アプレット: <view wx:for="{ {currentList}}" wx:for-index="s_index" wx:for-item="s_item"></view>
    ②ユニアプリ:<view v-for="(s_item,s_index) in currentList"></view>
  • if 判断:
    ①WeChat アプレット: <view wx:if="{ {isShow}}"></view>
    ②ユニアプリ:<view v-if="isShow"></view>
  • 属性バインディング:
    ①WeChat アプレット: <image src="{ {item.img}}"></image>
    ②ユニアプリ:<image :src="$util.img(item.img)"></image>
  • ページパラメータ:
    ①WeChat アプレット: <navigator url="/pages/live?id={ {item.room_id}}"></navigator>
    ②ユニアプリ:<navigator :url="'/pages/live?id=' + item.room_id"></navigator>
  • 入力の値はバインドされ、リッスンされます

        ①WeChat アプレット: <input value='{ { {sex}}'    bindinginput ='getInput'></input> 

                                   getInput(e){ //リアルタイム監視 console.log( e.detail.value ) }
        ②uni-app: < input v-model ='sex'></input>

  • 更新表示方法:
    ①WeChat アプレット: this.setData ({ data: 1 })
    ②uni-app: this.data = 1

 

WeChat アプレットと uniapp の類似点

1.ページラベルは基本的に同じです

ビュー、テキスト、スクロールビュー、入力、ピッカー、スワイパーなど

2. API は基本的に同じですが、wx を uni に置き換えるだけです。

ネイティブ書き込み: wx.request、wx.showModal、wx.showToast、wx.showLoading、wx.chooseImage、wx.switchTab、wx.navigateo、wx.setStorageSync など。

uniapp写法:uni.request、uni.showModal、uni.showToast、uni.showLoading、uni.chooseImage、uni.switchTab、uni..navigateo、uni.setStorageSync など

3.ライフサイクル機能は同じです

onLoad、onShow、onPullDownRefresh、onReachBotton、onShareAppMessage など。
 

では、小さなプログラムを開発するにはどうすればよいでしょうか? ネイティブ開発とユニアプリ開発の 2 つのオプションがあります。

1. ネイティブ開発

ホームページでのネイティブ開発の利点を見てみましょう。

①公式ドキュメントが明瞭でモバイルサービスの根底にあるロジックに近く、開発者は小規模なプログラムでもより的を絞った深い開発が可能となる。

②ネイティブ開発を利用することで、正式版に忠実に追従でき、アップデートの応答速度も速いため、プロジェクトを最適な状態に到達させることができます。

欠点を見てみましょう。

さまざまなプラットフォームで小さなプログラムを開発するには、WeChat 開発ツール、Ali 開発ツール、ByteDance 開発ツール、QQ 開発ツールなど、さまざまな開発ツールと構文が必要です。これが最良の選択ですが、マルチプラットフォーム アプレットを同時に開発する場合は、時間が経つと、同じプロジェクトに対して複数のコードセットを記述する必要があり、その後のメンテナンスに多大な労力とコストがかかります。

2. ユニアプリ開発

次に、uniapp 開発の利点を見てみましょう。

① 1 つのコードで 14 種類のプラットフォームをパッケージ化でき、さまざまな小規模プログラム H5 や APP アプリケーションを生成できるため、開発者はさまざまな開発ツールを行き来する必要がなく、HBuild を使用してすべてを完了できます。

hbuilderx エディタと連携して、アプレット、h5、アプリなどをパッケージ化して生成できます。

②vue の構文と小さなプログラム API を組み合わせて使用​​するため、簡単に始めることができます。vue の基礎があれば、ドキュメントを読んで直接始めることができます。vue の基礎がない場合は、vue の開発を習得できます。 uniapp. 結局のところ、vue はフロントエンド開発のハンドルです。

③uniapp は複数の端末をサポートしており、エコロジーに優れており、プロジェクトの要件が高くない場合は、コードをあまり書かずにすぐにアプリケーションを作成できます。

欠点を見てみましょう。

uniapp でパッケージ化された小さなプログラムは、プラットフォームの互換性の問題を抱えている可能性があります。同じコードでもプラットフォームが異なると異なります。正式版は積極的に更新されています。これらの問題は徐々に解決されると思います。 

おすすめ

転載: blog.csdn.net/admin12345671/article/details/129747919