ホームページ >ウェブフロントエンド >uni-app >コードがuniappのアプリ内でのみ実行されているかどうかを確認する方法

コードがuniappのアプリ内でのみ実行されているかどうかを確認する方法

PHPz
PHPzオリジナル
2023-04-14 13:53:541425ブラウズ

モバイル アプリケーションの急速な開発に伴い、開発者の間ではクロスプラットフォーム開発フレームワークの人気が高まっています。 Uniapp は、Vue.js フレームワークをベースとしたクロスプラットフォーム開発フレームワークとして、現在の市場で大きな注目を集めています。ただし、Uniapp では、コードが Web ブラウザーで実行されているのか、アプリで実行されているのかを判断する必要がある場合があります。この記事では、Uniapp のアプリ内でのみコードが実行されているかどうかを判断する方法を紹介します。

最初の方法: ナビゲーション バーを使用して表示と非表示を切り替える

Uniapp のナビゲーション バーは、アプリ ナビゲーション バーと Web ナビゲーション バーの 2 つの方法に分かれています。プロジェクトでは、この機能を使用して判断を下すことができます。

コードは次のように実装されます:

uni.onNavigationBarChange((res) => {
  if (res.type === 'show') {
    console.log('在App中运行')
  } else {
    console.log('在Web浏览器中运行')
  }
})

アプリ側では、ナビゲーション バーがデフォルトで表示されるため、ナビゲーション バーが表示されると、コードは Run #アプリ内の ## ステートメント。 Web ブラウザでアクセスすると、ナビゲーション バーはデフォルトで非表示になります。 を実行して、Web ブラウザで ステートメントを実行します。注: この方法では、ページ内でナビゲーション バーが有効になっている必要があります。

2 番目の方法: uni.getSystemInfoSync

uni.getSystemInfoSync メソッドを使用して、デバイス情報の platform 属性を取得してデバイス情報を取得します。裁判官。

コードは次のように実装されます:

const systemInfo = uni.getSystemInfoSync()
if (systemInfo.platform === 'android' || systemInfo.platform === 'ios') {
  console.log('在App中运行')
} else {
  console.log('在Web浏览器中运行')
}
アプリで実行すると、

platform 属性は android または ios## を返します。 #, したがって、 を実行して、アプリ内で ステートメントを実行します。Web ブラウザでアクセスすると、h5 が返されます。 を実行して、アプリ内で ステートメントを実行します。ウェブブラウザ。 3 番目の方法:

uni.postMessage

onmessage を使用して自分のページにメッセージを送信し、その後

onmessage を使用します。

メッセージを取得し、メッセージのソースを判断してコードがアプリ側または Web 側のどちらで実行されているかを判断します。 コードは次のように実装されます。

// 发送消息
uni.postMessage({ from: 'uniapp' })

// 监听消息
window.onmessage = (event) => {
  if (event.data.from === 'uniapp') {
    console.log('在App中运行')
  } else {
    console.log('在Web浏览器中运行')
  }
}

アプリで実行する場合、

postMessage

によって送信されるメッセージのソースは uniapp であるため、実行します。アプリ内の Web ブラウザで ステートメントにアクセスすると、postMessage メソッドが呼び出されないため、ステートメントは実行されません。 概要:

上記の 3 つの方法により、コードがアプリ内でのみ実行されるかどうかをより正確に判断できます。実際の開発では、プロジェクトのニーズに応じて適切な手法を選択できます。最初の方法を使用する場合、ページ上でナビゲーション バーを有効にする必要があることに注意してください。

Uniapp には多くの強力な機能があり、これがクロスプラットフォーム開発で人気がある理由の 1 つです。この記事が Uniapp 開発者に役立つことを願っています。

以上がコードがuniappのアプリ内でのみ実行されているかどうかを確認する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。