Uniapp 相关笔记

Freedom风间

已于 2022-12-03 14:15:47 修改

阅读量409

点赞数

分类专栏：个人笔记文章标签： uni-app javascript 前端

于 2022-12-03 14:12:51 首次发布

本文链接：https://blog.youkuaiyun.com/Ndbsa/article/details/128161128

版权

个人笔记专栏收录该内容

12 篇文章

订阅专栏

本文详细介绍了uni-app中Unt跳转的四个方法：navigateTo、redirectTo、reLaunch和switchTab，以及Uview组件的Form表单和upload使用。在遇到报错问题时，提供了解决方案，包括降低vue版本和安装特定版本的vue-template-compiler。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Unt跳转

uni.navigateTo(OBJECT)

保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。OBJECT参数说明：参数类型必填说明urlString是需要跳转的应用内非
tabBar 的页面的路径 ,
路径后可以带参数。参数与路径之间使用?分隔，参数键与参数值用=相连，不同参数用&分隔；
不可到tabBar 页

uni.navigateTo({
    url: 'test?id=1&name=uniapp'
});

uni.redirectTo(OBJECT)

关闭当前页面，跳转到应用内的某个页面。OBJECT参数说明参数类型必填说明urlString是需要跳转的应用内非
tabBar的页面的路径，路径后可以带参数。参数与路径之间使用?分隔，参数键与参数值用=相连，不同参数用&分隔；不可到tabBar页

uni.redirectTo({
    url: 'test?id=1' // 传递参数 id，值为1
});

uni.reLaunch(OBJECT)

关闭所有页面，打开到应用内的某个页面。OBJECT参数说明：参数类型必填说明urlString是需要跳转的应用内页面路径,路径后可以带参数。参数与路径之间使用?分隔，参数键与参数值用=相连，不同参数用&分隔；不可到tabBar页

uni.reLaunch({
    url: 'test?id=1'
});

uni.switchTab(OBJECT)

跳转到 tabBar 页面，并关闭其他所有非 tabBar页面。
OBJECT参数说明：参数类型必填说明urlString是需要跳转的 tabBar页面的路径(需在 app.json 的 tabBar 字段定义的页面)，路径后不能带参数

Uview

Form表单

显示必填*字符号 :required=“true”
Rules 必须在onReady赋值

uFormRef.value.setRules(data.rules)

upload

显示已经上传的图片需要绑定fileList属性

:file-list="sitePhotosList"

[格式如下]{.underline}

  fileList: [{
  url: 'http://pics.sc.chinaz.com/files/pic/pic9/201912/hpic1886.jpg',
  error: false,
  progress: 100
}],

报错问题

在这里插入图片描述

解决：
解决方案1:
定位到对应文件
在这里插入图片描述
修改此句为：

[v: string]: string | number | undefined

方案2：
— 主要是因为vue版本过高引起的，查看了一下vue的版本是vue@2.7.10，需要vue低版本的才可以打包成功

– 解决方案：
1、npm install vue@2.6.14 或者 npm install vue@2.6.14 --legacy-peer-deps
2、npm install vue-template-compiler@2.6.14 或npm install vue-template-compiler@2.6.14 --legacy-peer-deps