[uniapp+vue3] ページの読み込み時のさまざまな役割に応じてナビゲーション バーのタイトルを設定します

uniapp ページがロードされるときに、さまざまな役割に応じてナビゲーション バーのタイトルを設定します。

実際に実装するのはとても簡単ですが、uniappプロジェクトを開発するのは初めてなので何も分からず、少し遠回りしてしまいました。

該当ページのonLoadで、ジャンプで渡されるパラメータの判定ロールフィールドを取得します ここで渡しているのは、ナビゲーションバーのタイトルを直接変更できるgetRole uni.setNavigationBarTitleです。

<script lang="ts" setup>
import {
    
     onLoad,onShow } from "@dcloudio/uni-app";
import {
    
     reactive, getCurrentInstance, ref } from "vue";
const getRole = ref('')
onLoad((options)=>{
    
    
	 getRole.value = options.getRole
	if(getRole.value=='parent'){
    
    
		uni.setNavigationBarTitle({
    
    
		  title: '新增xx信息'
		});
	
	}

})
</script>

ナビゲーションバーのタイトルを取得したい場合は、$page.meta.navigationBar.titleText

<script lang="ts" setup>
import {
    
     onLoad,onShow } from "@dcloudio/uni-app";
import {
    
     reactive, getCurrentInstance, ref } from "vue";

onLoad((options)=>{
    
    
    const page = getCurrentPages()
	 const currentPage = page[0]
	const {
    
    $page} = currentPage
console.log($page.meta.navigationBar.titleText)

})
</script>