Uniapp开发中的常见方法与规避的坑

在Uniapp开发过程中，有一些常见的方法和需要注意的坑点。本文将对这些进行总结，帮助开发者更好地进行Uniapp开发。

1. 主题色的改变

Uniapp的主题色改变功能只能使用CSS变量，无法使用SCSS变量。此外，在绑定根元素样式时不能直接绑定整个对象，必须将每一个选项列出来。在使用时要注意使用横杠而不是驼峰。

1. 组件布局

每个页面组件的最外层需要包一层view，否则在高度计算时会出现问题。在布局时，需要注意避免绝对定位的使用，因为这可能导致一些不可预期的问题，例如键盘弹起时顶部的空白问题。

1. 引用路径

在拆分引用组件时，引用路径一定要完整引用到.vue文件，不能使用index.ts或index.js。否则，编译后的小程序会报组件引用不到的错误。

1. WebSocket地址

微信小程序中的WebSocket地址需要将wss写成wxs。

1. 定位问题

在uni-ui的popup中使用输入框、文本域时，可能会出现样式问题。此外，scroll-view中的子元素无法基于该父元素进行绝对定位，需要将子元素包在一层或者提到外面同级进行定位。

1. 自动聚焦问题

不同平台和浏览器对于自动聚焦的处理可能会有所不同。例如，支付宝无法自动聚焦，而且在支付宝平台上发起验证码时，键盘没有一键粘贴板的功能。百度在自动聚焦时blur事件总是先于focus事件，因此在多个input存在的情况下，要靠程序自动唤起B input聚焦，必然会先执行A的失焦事件，然后再执行B的聚焦事件。不同机型在允许自动聚焦功能的平台上，聚焦和失焦的事件处理也会有差别，例如ios普遍失焦事件先于聚焦事件，在频繁地操作聚焦失焦时，ios容易出现键盘的起落问题。在多个input框存在的情况下点击键盘的一键粘贴，再重新的验证码分配到其他几个input的情况下，会先触发所有值发生改变的input的onInput事件，Android不会触发其他input的onInput事件。在ios上，如果在一个input框输入多余的值再删除，然后再删除另一个input的值，重新聚焦第一个input时，聚焦的位置不是值的最后面的位置。因此，开发者需要注意这些自动聚焦的问题，避免出现不必要的麻烦。

1. 其他问题

此外，还有一些其他需要注意的问题。例如小程序直播流使用flv可能会出现音画不同步的问题。在某些浏览器中，自动填充粘贴板的值时会产生黄色背景，会遮挡原本设置的样式，除非input的值再次发生变化。对于多个input或textarea要避免自动唤起聚焦的操作。慎用绝对定位，在支付宝唤起键盘时可能会导致顶部出现空白等问题。

综上所述，Uniapp开发中需要注意很多细节和坑点。开发者需要充分了解和掌握这些常见问题和解决方法，才能更好地进行Uniapp开发。同时，也需要不断学习和探索新的技术和方法，提高自己的开发水平和解决问题的能力。