1.uni-app简介

• 页面遵循Vue当文件组件的格式规范

vue文件.png

• 跨端兼容

uni-app 已将常用的组件、JS API 封装到框架中，开发者按照 uni-app 规范开发即可保证多平台兼容，大部分业务均可直接满足。

但每个平台有自己的一些特性，因此会存在一些无法跨平台的情况。
uni-app 提供了条件编译手段，在一个工程里优雅的完成了平台个性化实现。

跨平台编译.png

模板块使用
<view class="login">

    <!-- #ifdef APP-PLUS || MP-QQ || H5 -->
    <FindItem src="../../static/login-icon/qqq.png" text="QQ登录" @click="qq" :oneRowItemNum="oneRowItemNum"></FindItem>
    <!-- #endif -->

    <!-- #ifdef APP-PLUS || MP-WEIXIN || H5-->
    <FindItem src="../../static/login-icon/weixin.png" text="微信登录" @click="wechat" :oneRowItemNum="oneRowItemNum"></FindItem>
    <!-- #endif -->

</view>

脚本块使用
onLoad() {
    this.oneRowItemNum = "2"

    //#ifdef MP-WEIXIN ||  MP-QQ
    this.oneRowItemNum = "1";
    // #endif
}