基于vue框架的uniapp小程序开发发现了新大陆

项目场景:

在基于vue框架的uniapp小程序开发中,在页面跳转时,当前页路径带参数,在跳转页中接受数据除了用官方推荐的保留当前页面,跳转到应用内的某个页面,使用onLoad(option)接受数据,但是我发现另外一个方法也可以接收参数,发现新大陆了。

//在起始页面跳转到test.vue页面并传递参数
uni.navigateTo({url: 'test?id=1&name=uniapp'
});
// 在test.vue页面接受参数
export default {onLoad: function (option) { //option为object类型,会序列化上个页面传递的参数console.log(option.id); //打印出上个页面传递的参数。console.log(option.name); //打印出上个页面传递的参数。}
}

问题描述

我们常用props的,根据官网文档是接受父组件传递过来的参数,实际上任何类型的值都可以作为 props 的值被传递。所有的 props 都遵循着单向绑定原则,props 因父组件的更新而变化,自然地将新的状态向下流往子组件,而不会逆向传递

export default {props: {greetingMessage: String}
}
<MyComponent greetingMessage="hello" />

要声明对 props 的校验,你可以向 props 选项提供一个带有 props 校验选项的对象

export default {props: {// 基础类型检查//(给出 `null` 和 `undefined` 值则会跳过任何类型检查)propA: Number,// 多种可能的类型propB: [String, Number],// 必传,且为 String 类型propC: {type: String,required: true},// Number 类型的默认值propD: {type: Number,default: 100},// 对象类型的默认值propE: {type: Object,// 对象或者数组应当用工厂函数返回。// 工厂函数会收到组件所接收的原始 props// 作为参数default(rawProps) {return { message: 'hello' }}},// 自定义类型校验函数propF: {validator(value) {// The value must match one of these stringsreturn ['success', 'warning', 'danger'].includes(value)}},// 函数类型的默认值propG: {type: Function,// 不像对象或数组的默认,这不是一个// 工厂函数。这会是一个用来作为默认值的函数default() {return 'Default function'}}}
}

🔥发现新大陆:

既然发现使用props也可以接收路径跳转传参,和子组件中的使用方式一摸一样,这算是一个新发现😮
在这里插入图片描述
在这里插入图片描述
官方推荐的方式
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/128956.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

webpack不同环境下使用CSS分离插件mini-css-extract-plugin

1.背景描述 使用mini-css-extract-plugin插件来打包css文件&#xff08;从css文件中提取css代码到单独的文件中&#xff0c;对css代码进行代码压缩等&#xff09;。 本次采用三个配置文件&#xff1a; 公共配置文件&#xff1a;webpack.common.jsdev开发环境配置文件&#x…

IDEA 2021.2.2设置自动热部署

1.导入包坐标 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-devtools</artifactId><scope>runtime</scope><optional>true</optional></dependency> 2.pom.xml添加piugins插…

Git 学习笔记 | Git 项目创建及克隆

Git 学习笔记 | Git 项目创建及克隆 Git 学习笔记 | Git 项目创建及克隆创建工作目录与常用指令本地仓库搭建克隆远程仓库 Git 学习笔记 | Git 项目创建及克隆 创建工作目录与常用指令 工作目录&#xff08;WorkSpace)一般就是你希望Git帮助你管理的文件夹&#xff0c;可以是…

详细介绍区块链之挖矿

对不起&#xff0c;大家&#xff0c;这篇文章对作者来说实在是太有意义和含金量了&#xff0c;作者想把它设置为关注博主才能见全文&#xff0c;请大家理解&#xff01;如果觉得还是看不懂&#xff0c;抱歉耽误大家的时间&#xff0c;就请取消关注&#xff01;&#xff01;&…

分类预测 | MATLAB实现KOA-CNN开普勒算法优化卷积神经网络数据分类预测

分类预测 | MATLAB实现KOA-CNN开普勒算法优化卷积神经网络数据分类预测 目录 分类预测 | MATLAB实现KOA-CNN开普勒算法优化卷积神经网络数据分类预测分类效果基本描述程序设计参考资料 分类效果 基本描述 1.MATLAB实现KOA-CNN开普勒算法优化卷积神经网络数据分类预测&#xff0…

.NET ABP.Zero 项目疑似内存排查历程

当前项目是 .NET 5 EentityFrameworkCore&#xff0c;疑似内存泄漏&#xff0c;之所以说是疑似是因为到目前位置还没有能准确的定位到问题。当前这个框架从 .NET Core 2.1 就开始用&#xff0c;期间有升级到 3.1、5.0、6.0&#xff0c;在排查过程中还把 5.0 分支升级到了 7.0 。…

Vue3 + Ts实现NPM插件 - 定制loading

目录 你的 Loading&#x1f916; 安装&#x1f6f9; 简介苍白请 您移步文档&#xff1a;✈️ 使用方法&#x1f6e0;️ 配置 loading 类型&#x1f3b2; 定制 loading 色彩 &#x1f4a1; 注意事项 前期回顾 你的 Loading 开箱即可用的 loading&#xff0c; 说明&#xff1a;vu…

springboot项目做成公共项目

一&#xff1a;引言 最近碰到个需求&#xff0c;就是把我项目做成一个公共的提供jar包给别人使用&#xff0c;我也是捣鼓了一段时间去研究这个问题&#xff0c;这个东西其实就是A 项目提供jar包给B项目&#xff0c;B项目只要引入A项目的jar包就可以使用A项目的功能。 问题一&…

基于Springboot实现学生毕业离校系统项目【项目源码+论文说明】分享

基于Springboot实现学生毕业离校系统演示 摘要 随着科学技术的飞速发展&#xff0c;社会的方方面面、各行各业都在努力与现代的先进技术接轨&#xff0c;通过科技手段来提高自身的优势&#xff0c;新生宿舍管理系统当然也不能排除在外。新生宿舍管理系统是以实际运用为开发背景…

java Spring Boot在配置文件中关闭热部署

之前更大家一起搭建了一个热部署的开发环境 但是 大家要清楚一个情况 我们线上程序运行突然内部发生变化这是不可能的。 所以 他就只会对我们开发环境有效 是否开启 我们可以通过 application配置文件来完成 我这里是yml格式的 参考代码如下 spring:devtools:restart:enabled…

STM32F4X 内部FLASH使用

STM32F4X 内部FLASH使用 STM32F4X 内部FLASHSTM32F4X内部FLASH结构STM32F40X和STM32F41X内部FLASH结构STM32F42X和STM32F43X内部FLASH结构 STM32F4X内部FLASH操作例程internal_flash.hinternal_flash.cmain.c 在嵌入式开发中&#xff0c;经常需要实时保存一些数据。如果工程的代…

unity使用UniStorm 5.1.0.unitypackage增加天气

添加天天气组件unistorm 然后添加一个player 导入包会报错,需要修改代码 using UnityEngine; using UnityEngine.PostProcessing;namespace UnityEditor.PostProcessing {[CustomPropertyDrawer(typeof(UnityEngine.PostProcessing.MinAttribute))]sealed class MinDrawer : …