因 uniapp 需同时兼容PC端,移动端,微信小程序端,app端等,建议按以下开发规范开发,可更加有效避开多端不兼容的情况:
vue 文件使用 div标签包裹
<template> <div> <!-- 页面代码 --> </div> </template>
容器样式不要写在组件上
此处 class 不要写在 u–form,单独用 view 包裹 u–form 来添加样式
<view class="formBox"> <u--form>
改组件样式使用样式穿透 + !important
直接在组件上添加样式,会出现某些端不生效的情况,建议统一用样式穿透 + !important实现
::v-deep .u-button--square { border-radius: 0 !important; }
文件上传需做 name 兼容处理
微信小程序上上传文件,无法获取到文件名,需做 name 兼容处理
uploadOK(e) { if (e.file.name) { // 避免文件名中有逗号,导致云存储无法删除 e.file.name = e.file.name.replace(/,/g, '') } this.fileList = [e.file] },
cloudPath: 'blog/' + timeMark + (this.fileList[0].name || Math.floor(Math.random() * 100)),