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)),
相关推荐
小徐_23332 天前
uni-app vue3 也能使用 Echarts?Wot Starter 是这样做的!
前端·uni-app·echarts
iOS阿玮2 天前
永远不要站在用户的对立面,挑战大众的公知。
uni-app·app·apple
xw52 天前
uni-app中v-if使用”异常”
前端·uni-app
!win !2 天前
uni-app中v-if使用”异常”
前端·uni-app
2501_915918412 天前
iOS 上架全流程指南 iOS 应用发布步骤、App Store 上架流程、uni-app 打包上传 ipa 与审核实战经验分享
android·ios·小程序·uni-app·cocoa·iphone·webview
00后程序员张3 天前
iOS App 混淆与加固对比 源码混淆与ipa文件混淆的区别、iOS代码保护与应用安全场景最佳实践
android·安全·ios·小程序·uni-app·iphone·webview
00后程序员张3 天前
详细解析苹果iOS应用上架到App Store的完整步骤与指南
android·ios·小程序·https·uni-app·iphone·webview
海绵宝宝不喜欢侬3 天前
uniapp-微信小程序分享功能-onShareAppMessage
微信小程序·小程序·uni-app
2501_915106323 天前
Xcode 上传 ipa 全流程详解 App Store 上架流程、uni-app 生成 ipa 文件上传与审核指南
android·macos·ios·小程序·uni-app·iphone·xcode
xkxnq3 天前
Uniapp崩溃监控体系构建:内存泄漏三维定位法(堆栈/资源/线程)
uni-app