uniapp 开发规范(兼容性适配)

因 uniapp 需同时兼容PC端,移动端,微信小程序端,app端等,建议按以下开发规范开发,可更加有效避开多端不兼容的情况:

vue 文件使用 div标签包裹

html 复制代码
<template>
	<div>
	  <!-- 页面代码 -->
	</div>
</template>

容器样式不要写在组件上

此处 class 不要写在 u--form,单独用 view 包裹 u--form 来添加样式

html 复制代码
<view class="formBox">
			<u--form>

改组件样式使用样式穿透 + !important

直接在组件上添加样式,会出现某些端不生效的情况,建议统一用样式穿透 + !important实现

复制代码
	::v-deep .u-button--square {
		border-radius: 0 !important;
	}

文件上传需做 name 兼容处理

微信小程序上上传文件,无法获取到文件名,需做 name 兼容处理

js 复制代码
uploadOK(e) {
	if (e.file.name) {
		// 避免文件名中有逗号,导致云存储无法删除
		e.file.name = e.file.name.replace(/,/g, '')
	}
	this.fileList = [e.file]
},
js 复制代码
cloudPath: 'blog/' + timeMark + (this.fileList[0].name || Math.floor(Math.random() * 100)),
相关推荐
00后程序员张15 分钟前
iOS 26 内存占用监控 多工具协同下的性能稳定性分析实战
android·macos·ios·小程序·uni-app·cocoa·iphone
2501_915909062 小时前
iOS 26 性能监控工具有哪些?多工具协同打造全方位性能分析体系
android·macos·ios·小程序·uni-app·cocoa·iphone
Felicity_Gao3 小时前
uni-app 开发APP应用媒体处理与文件管理功能
java·uni-app·媒体
2501_915918413 小时前
uni-app 上架 iOS 应用全流程 从云打包到开心上架(Appuploader)免 Mac 上传发布指南
android·macos·ios·小程序·uni-app·iphone·webview
2501_915921435 小时前
iOS 抓包工具有哪些,开发者的选型与实战指南
android·ios·小程序·https·uni-app·iphone·webview
2501_915918415 小时前
iOS 26 应用管理实战 多工具协同构建开发与调试的高效体系
macos·ios·小程序·uni-app·objective-c·cocoa·iphone
游戏开发爱好者87 小时前
iOS 抓包工具实战 开发者的工具矩阵与真机排查流程
android·ios·小程序·https·uni-app·iphone·webview
星光一影16 小时前
供应链进销存源码uniapp全开源ERP多仓库管理系统pc+app手机端
mysql·elementui·uni-app·开源·php·phpstorm·1024程序员节
A腿长一米二16 小时前
【uniapp问题还是我的认知问题】
uni-app
2501_9159090620 小时前
网络调试工具推荐 Fiddler抓包工具使用教程与代理设置详解(HTTP/HTTPS配置与实战技巧)
网络·http·ios·小程序·fiddler·uni-app·webview