您的位置:首页 > 汽车 > 时评 > 高端品牌男装_哪个浏览器不屏蔽网站_互联网营销师是什么_接app推广接单平台

高端品牌男装_哪个浏览器不屏蔽网站_互联网营销师是什么_接app推广接单平台

2024/12/25 2:29:46 来源:https://blog.csdn.net/xiaolouuuu/article/details/144408375  浏览:    关键词:高端品牌男装_哪个浏览器不屏蔽网站_互联网营销师是什么_接app推广接单平台
高端品牌男装_哪个浏览器不屏蔽网站_互联网营销师是什么_接app推广接单平台

uni-app搭建小程序时候Vue3语法接收路由参数,去官方文档查看,是onLoad的option接收参数,我试过,接收不到,上网查各种方法也是不太行,最后自己琢磨出来了,这参数藏得还挺深!!

目录

一、路由携带参数 

二、另一个页面接收传递的参数

1、引入getCurrentInstance

2、打印getCurrentInstance().proxy.$scope

3、传过来的参数id就在getCurrentInstance().proxy.$scope.options.id


一、路由携带参数 

这个比较简单,官方文档也有写。

官方路由传参文档:

uni.navigateTo(OBJECT) | uni-app官网

const clickItem = (id) => {console.log("当前点击的商品下标是" + id);// UniApp页面跳转,携带参数uni.redirectTo({url: `/pages/shopdetail/shopdetail?id=${id}`});
};

二、另一个页面接收传递的参数

1、引入getCurrentInstance

getCurrentInstance() 返回的是当前组件的实例,它包含了很多关于组件的内部信息。你可以通过 instance.proxy 访问组件的公共属性。

import { ref, onMounted,getCurrentInstance } from 'vue'; // 引入 Vue 的钩子
onMounted(async() => {const instance= getCurrentInstance()console.log('getCurrentInstance()',instance);
})

 打印出来如下:

2、打印getCurrentInstance().proxy.$scope

const instance= getCurrentInstance().proxy.$scopeconsole.log('getCurrentInstance()',instance);

proxy 是 getCurrentInstance() 返回对象中的一个属性,允许你访问组件的公开属性和方法,例如访问 this.$routethis.$emit 等。proxy 是访问这些实例属性的推荐方式。

 uniapp和Vue3的区别:

在 Vue 3 中,$route 是由 Vue Router 提供的,用于访问当前路由的对象。在 UniApp 中,$scope 是每个页面实例的上下文对象。这个对象包含了页面的各种信息,比如页面的路由参数、页面的状态、以及一些页面生命周期的钩子函数。

  • $route:是 Vue Router 提供的,用于访问路由对象,通常在 Vue 3 中使用。
  • $scope:是 UniApp 提供的,代表页面实例的上下文。你可以通过 proxy.$scope.options 来访问路由参数。

getCurrentInstance().proxy.$scope打印出来如下:

3、传过来的参数id就在getCurrentInstance().proxy.$scope.options.id

const instance= getCurrentInstance().proxy.$scope.options.id
console.log('getCurrentInstance()',instance);

 getCurrentInstance().proxy.$scope.options打印出来如下:

getCurrentInstance().proxy.$scope.options.id打印出来如下:

 这小参数还挺能藏!!!!!试试携带多个参数:

也能获取到: 

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com