【uniapp+vue3 】页面加载时根据不同角色设置导航栏标题

花椒和蕊2023-09-21 13:25

uniapp 页面加载时根据不同角色设置导航栏标题

其实很好实现，第一次开发uniapp项目，所以什么都不懂，绕了一点点的弯路

在对应页面的onLoad中获取到跳转过来传的参数中的判断角色字段，我这里传的是getRole

uni.setNavigationBarTitle可以直接改导航栏标题

bash 复制代码

<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

bash 复制代码

<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>