先说这个问题,如何向tabbar页面传递参数,为什么会有这个问题,请看uniapp的文档上是这么写的;

所以像下方写的代码,是完全不生效的!只会跳到tabbar center页面,但是并不能在onLoad中获取到传递的参数

uni.switchTab({
	url: '/pages/center/center?id=999'

那么如何去向tabbar页面传递参数?

1. 利用缓存storage

<template>
	<view><button @click="click">去tabbar center页面</button></view>
</template>
<script>
export default {
	methods: {
		click() {
			uni.setStorageSync('id', 999);
			uni.switchTab({
				url: '/pages/center/center'
</script>

tabbar页面 center

<template>
	<view>center</view>
</template>
<script>
export default {
	onShow() {
		const id = uni.getStorageSync('id');
		console.log(id);
</script>

2. 利用全局变量globalData

App.vue

list页面

<template>
	<view><button @click="click">去tabbar center页面</button></view>
</template>
<script>
export default {
	methods: {
		click() {
			// 利用App.vue globalData
			getApp().globalData.id = 999;
			uni.switchTab({
				url: '/pages/center/center'
</script>

tabbar页面 center

<template>
	<view>center</view>
</template>
<script>
export default {
	onShow() {
		const id = getApp().globalData.id;
		console.log(id);
</script>

3. 利用vuex

store/index.js

list.vue

<template>
	<view><button @click="click">去tabbar center页面</button></view>
</template>
<script>
import { mapMutations } from 'vuex';
export default {
	methods: {
		...mapMutations(['setId']),
		click() {
			// 3.利用vuex
			this.setId(999);
			uni.switchTab({
				url: '/pages/center/center'
</script>

tabbar页面 center

<template>
	<view>center</view>
</template>
<script>
import { mapState } from 'vuex';
export default {
	computed: {
		...mapState(['id'])
	onShow() {
		console.log(this.id);
</script>

除此之外有人可能会想起为什么不适用uni.$on uni.$emit的方式,那就是看文档又不认真了嗷

如何使用uni.$emit()和uni.$on() 进行页面间通讯 - DCloud问答

 什么意思呢,就是说,如果我们tabbar center页没有被打开过,那么从任意一个页面跳转到center页面,center页面是属于首次打开的情况,那么即使你在跳转的页面使用uni.$emit发送了一个事件携带了数据,但是center中的uni.$on是监听不到的,故,在此场景中uni.$on;uni.$emit并不适用,不推荐

先说这个问题,如何向tabbar页面传递参数,为什么会有这个问题,请看uniapp的文档上是这么写的;所以像下方写的代码,是完全不生效的!只会跳到tabbar center页面,但是并不能在onLoad中获取到传递的参数uni.switchTab({ url: '/pages/center/center?id=999'});那么如何去向tabbar页面传递参数?1. 利用缓存storage&lt;template&gt; &lt;view&gt;&lt;button @ 普通页跳转到普通页:open-type="navigate"(默认navigate) 普通页跳转到tabBar页面:open-type="switchTab" tabBar页面跳转到普通页:open-type="navigate" tabBar页面跳转到tabBar页面:open-type="switchTab"
官网中说明uni-app和小程序的switchTab跳转tabbar页面,路径后不能带参数,所以,以下使用两种方法进行tabbar页面之间的传参。 全局变量传参(globalData全局变量) 传递参数页面: getApp().globalData.name = "lixian"; uni.switchTab({ url:'../tabbar2/tabbar2?name=' + name 接受参数的页面: 全局变量数据加载显示在onShow方法中 onShow(){ this.name =
tabbar 在H5端是div模拟的,属于前端屏幕窗口的一部分,如果要使用bottom居底定位方式,应该使用css变量–window-bottom,比如悬浮在tabbar上方10px的按钮,样式如下 bottom: calc(var(--window-bottom) + 10px)
在 uni-app 中,可以使用 uni.switchTab(OBJECT) 方法来切换到指定的 tab 页面,其中 OBJECT 参数中可以包含 url 和 params 两个属性,用于指定要跳转的页面路径和传递的参数。 uni.switchTab({ url: '/pages/index/index', params: { name: '参数名',
要实现从登录页面跳转到tabbar页面,可以使用uni-app提供的路由跳转功能。具体步骤如下: 1. 在登录成功后,使用uni.navigateTo方法跳转到tabbar页面。例如: uni.navigateTo({ url: '/pages/tabbar/tabbar' 2. 在tabbar页面中,需要在页面配置文件(如pages.json)中设置tabBar属性,指定底部菜单栏的样式和功能。例如: "tabBar": { "color": "#999", "selectedColor": "#007aff", "backgroundColor": "#f7f7f7", "borderStyle": "black", "list": [ "pagePath": "/pages/index/index", "text": "首页", "iconPath": "/static/tabbar/home.png", "selectedIconPath": "/static/tabbar/home_active.png" "pagePath": "/pages/mine/mine", "text": "我的", "iconPath": "/static/tabbar/mine.png", "selectedIconPath": "/static/tabbar/mine_active.png" 注意:tabBar属性中的list数组中的每一项都需要指定pagePath属性,对应的值为tabbar页面中的子页面路径。 希望能够帮到你!
const store = appStore() let {baseUrl, ipList} = storeToRefs(store) baseUrl.value = '******' 可以直接修改的 如何获取到他人小程序的页面路径 鱼儿有梦也会飞翔: 记录:通过day.js获取两个日期相差的时间,并转化为年月日的格式 uview 官网来的, 看到是河南老乡来点个赞 关于slot-scope已经废弃的问题 城南北角: ok,多谢,我一直没这么写过,我以为只能写一个,多谢多谢