您的当前位置:首页正文

uniapp开发问题总结

2024-11-08 来源:个人技术集锦

1. 微信小程序代码上传后,在体验版或线上无法调用接口

解决:
(1)登录微信小程序后台
(2)点击 开发管理 – 开发管理 – 修改服务器域名
(3)将使用到的域名改为你的接口域名

2. 微信开发者工具刷新后,AppID改变

解决:在manifest.json里修改微信的appid

3. uniapp开发微信小程序不能使用v-show

使用v-if或者用css: display: none;

4. 微信小程序原生标签无法使用ref获取元素,只有自定义组件可以使用ref

5.小程序底部导航栏tabBar

(1)uni.setTabBarItem(OBJECT)在h5,小程序中无法切换页面路径、是否显示

(2)导航栏tabBar最少2个、最多5个 tab

  • 多余5个或者根据权限切换tab,使用uView的tabbar组件

6. 使用uni.navigateBack(OBJECT)返回时刷新上一个页面数据

  • 请求没有参数时将请求放在onShow
  • 有参数时使用uni.$emit()和uni.$on()
uni.navigateBack()
uni.$emit('update',{id: this.id})
onShow() {
	uni.$on('update', (data) => {
		this.getDataList({
			id: data.id,
		})
	})
},

7. 小程序在css中不能使用本地图片当背景图片background

解决:
(1)使用网络图片,将图片上传到服务器
(2)将图片转为base64
(3)使用<image/>标签,定位成背景图片

8. 小程序无法定位

解决:在"mp-weixin"里加上

"mp-weixin" : {
        "permission" : {
            "scope.userLocation" : {
                "desc" : "打开定位授权,选取用户当前位置"
            }
        },
        "requiredPrivateInfos" : [ "chooseLocation", "getLocation" ]
    },

requiredPrivateInfos
自 2022714 日后发布的小程序,使用以下8个地理位置相关接口时,需要声明该字段,否则将无法正常使用。2022714 日前发布的小程序不受影响。

申明需要使用的地理位置相关接口,类型为数组。目前支持以下项目:

getFuzzyLocation: 获取模糊地理位置
getLocation: 获取精确地理位置
onLocationChange: 监听实时地理位置变化事件
startLocationUpdate: 接收位置消息(前台)
startLocationUpdateBackground: 接收位置消息(前后台)
chooseLocation: 打开地图选择位置
choosePoi: 打开POI列表选择位置
chooseAddress: 获取用户地址信息

9. 小程序,h5中rich-text组件里的<a href=""></a>标签不能跳转href属性无效

解决: 使用uView的组件

10. 小程序中标签名、属性名选择器、id选择器都不能用。

11. eval函数不可用

12. 数据为null也会显示在页面上

null就替换为空字符串''

13.uni-app文字一行显示,不会自动换行

使用css样式:word-break: break-word; 可以避免文字超出限制(break-word不会切断单词,break-all会无视单词完整性切断单词)

14. input输入框设置disabled后点击事件失效

使用css样式pointer-event:none

15.uniapp打包,上线部署后页面有缓存

// vue.config.js
if (process.env.UNI_PLATFORM === 'h5') {
    //微信小程序无法正常使用
    let filePath = './static/js/'
    let Timestamp = new Date().getTime()
    let version = '-V1.0.0-'
    module.exports = {
        // webpack 相关配置
        filenameHashing: false,
        configureWebpack: { // webpack 配置 解决js缓存的问题,目前只适配H5端打包
            output: { // 输出重构  打包编译后的 文件目录 文件名称 【模块名称.时间戳】
                filename: `${filePath}[name]${version}${Timestamp}.js`,
                chunkFilename: `${filePath}[name]${version}${Timestamp}.js`
            },
        }
    }
}else{
    // webpack 相关配置
    module.exports = {
        filenameHashing: false
    }
}




(2)在nignx的配置文件,配置如下内容禁用缓存

location / {
    add_header Cache-Control "no-cache, no-store, must-revalidate";
    add_header Pragma "no-cache";
    add_header Expires 0;
}
显示全文