uniapp いくつかのナビゲーションジャンプとパラメータ

宣言的なジャンプはコンポーネントを使用してジャンプします

ナビゲーターを使ってジャンプする

通常のページにジャンプします

<!-- 跳转到普通页面 有返回键-->
<navigator url="/pages/about/about" hover-class="navigator-hover">
  <button type="default">跳转到关于页面</button>
</navigator>

タブバーページにジャンプします

<!-- 跳转到tabbar页面 无返回键 关闭所有非tabelbar页面-->
<navigator url="/pages/message/message" open-type="switchTab">
  <button type="default">跳转到message页面</button>
</navigator>

APIジャンプを使用したプログラムによるジャンプ

navigateToメソッドを使用して通常のページにジャンプします

現在のページを保持し、アプリケーション内のページにジャンプし、それを使用してuni.navigateBack元のページに戻ります。

<button type="primary" @click="goAbout">跳转到关于页面</button>

goAbout () {
  uni.navigateTo({
    url: '/pages/about/about',
  })
}

switchTab を介してタブバーページにジャンプします (タブバー以外のすべてのページを閉じるためのリターンキーはありません)

タブバーページにジャンプします

<button type="primary" @click="goMessage">跳转到message页面</button>

goMessage () {
  uni.switchTab({
    url: '/pages/message/message'
  })
}

redirectTo メソッドを使用して通常のページにジャンプし、現在のページを閉じます

<button type="primary" @click="goMessagesss">跳转到message页面</button>

goMessagesss () {
			  uni.redirectTo({
			  	url: '/pages/login/login'
			  })
			}

現在のコンポーネントが onUnload によって実際にアンロードされていることをテストします。

onUnload () {
  console.log('组件卸载了')
}

ナビゲーションジャンプパスパラメータ受信パラメータ

次のページに移動しているときに、対応するパラメータを次のページに渡すことができ、パラメータを受け取るページは onLoad ライフサイクルを通じて受け取ることができます。

宣言的なジャンプパラメータの受け渡し

<navigator url="/pages/login/login?id=80&age=19" hover-class="navigator-hover">
		  <button type="default">跳转到login页面</button>
</navigator>

プログラムによるジャンプパラメータの受け渡し

goAbout () {
  uni.navigateTo({
    url: '/pages/about/about?id=80',
  });
}

パラメータを受け取るページ

<script>
	export default {
		onLoad (options) {
			console.log(options)
		}
	}
<script>

uniapp いくつかのナビゲーション ジャンプとパラメータ