uni app开发小程序的坑

Uni-app是一款支持多端开发的框架，可以写一份代码就能够发布成微信小程序、App、H5等多端应用，常见的开发语言有Vue、React、Angular等。但是在使用uni-app开发小程序的过程中，我们也会遇到一些坑，下面就来介绍一下。

1. 渲染延迟问题

在使用uni-app开发小程序时，遇到的最大问题可能就是页面跳转和数据渲染不及时，导致页面渲染延迟。这个问题很常见，特别是在动态渲染数据的时候，如下拉列表等组件。解决方法可以在数据绑定前加上this.$nextTick()，让渲染稍微延迟一下，来提升渲染效率。

2. 页面传参问题

在小程序开发中，我们经常会使用页面跳转传递参数，而在uni-app中，这个机制有了一定的变化。在使用uni-app开发小程序时，如果需要传递参数给下一个页面，可以在跳转时加上query参数，例如：

```js

//uni.navigateTo

uni.navigateTo({

url:'../test/test?id=1&name=test'

})

//在下一个页面中接收参数

export default{

onLoad(options){

console.log(options)

}

}

```

3. 按需引入组件

在开发小程序的过程中，我们经常会使用到第三方组件库，如iView、Vant等。为了保证应用的性能和体积最小化，我们可以采用按需引入的方式，只引入需要使用的组件，而不是一次性全部引入。

```js

// iView组件按需引入

import {Input,Button} from 'iview'

```

4. 双向绑定问题

在vue中，我们可以使用v-model实现双向绑定，但在uni-app中，官方不建议使用v-model指令，而是推荐使用sync修饰符来实现双向绑定。如下：

```html

```

5. tabBar页面设置问题

在原生小程序开发中，我们需要在app.json中设置tabBar页面，而在uni-app中，tabBar页面的设置需要在pages.json中进行，需要注意。同时，在设置底部tabbar的页面时，需要在组件中使用自定义导航栏(如tabbar)支持组件。

以上就是使用uni-app开发小程序时可能会遇到的坑，需要我们注意解决，打开浏览器开始开发啦！