APP开发教程|如何使用统软云的AVM框架开发App？

经过一年多的开发，随着编程经验的接近，它已成为中国主流的多端开发框架之一。本文将整理开发人员的贡献，并详细介绍如何使用统软云的AVM开发App。

以一个以“预订”为主要功能的App开发为例，本文将从App结构、App原型、App前端开发和App后台构建四个方面介绍该App的开发过程。

01排序App结构

首先，我们需要梳理“预约”App的结构和核心功能，并通过思想引导绘制App的基本结构。

02绘制App原型

根据App结构，进一步细化每个App页面的功能显示，并使用（www.devbefore.com）绘制“约会”App的原型。

原型链接可以在此处查看。

03应用前端开发

“预订”App的前端是使用统软云开发的，包括几个关键点，如切换器转盘映射和网络请求封装。使用统软云多终端技术进行开发，可以实现一套代码多终端运行，并支持编译成Android&IOSApp和微信小程序。

01

使用统软云的步骤

（1） 下载统软云 Studio 3作为开发工具。下载地址：点击此处下载。

（2） 注册帐户后，在控制台上创建App。控制台地址：单击此处查看。

（3） 设置证书并一键创建Android证书。

（4） 统软云 Studio3提取代码，单击项目，并将其导出到云以进行签出

侦查

签出后的工作目录

（5） 修改或提交项目源代码，并为当前项目的云编译自定义加载器，以进行实时同步调试预览。

使用AppLoader预览真机同步调试，后台会自动将其作为Loader下载到移动终端。安装后，点击小圆圈，输入IP地址：192.168.2.152端口：10916。连接后，真机将同步，您可以看到刚刚创建的结果。

02

AVM框架的使用

AVM的主要优点如下：

易于使用：使用Vue和React，您可以快速入门，并且它配备了一个特殊的开发工具统软云 Studio3。

多终端：一次性开发、多终端渲染和移动终端开发的一个技术堆栈。

丰富的功能API：可以直接调用1k+模块和2w+API，不受行业和场景限制。

（1） 用户界面

官方文件：点击此处查看

许多UI都是我们自己设计的。你也可以参考开发者Vagabond Man制作的AUI框架。阿里巴巴字体图标用于字体图标。

统软云官方网站已组装了一组面包车组件，可在此处查看。

（2） Ajax网络交互

使用以下代码。

//以表单模式提交数据或文件

api.ajax({

url:'http://192.168.1.101:3101/upLoad' ;,

方法：'post'，

数据：{

值：{

name：'哈哈'

},

文件：{

文件：'fs://a.gif'

}

}

}，函数（ret，err）{

如果（ret）{

App编程接口。警报（｛msg:JSON.stringify（ret）｝）；

}其他{

App编程接口。警报（｛msg:JSON.stringify（err）｝）；

}

});

//提交JSON数据

api.ajax({

url:'http://192.168.1.101:3101/upLoad' ;,

方法：'post'，

标题：{

“内容类型”：'；应用/json；字符集=utf-8'

},

数据：{

正文：{

name：'哈哈'

}

}

}，函数（ret，err）{

如果（ret）{

App编程接口。警报（｛msg:JSON.stringify（ret）｝）；

}其他{

App编程接口。警报（｛msg:JSON.stringify（err）｝）；

}

});

（3） vue指令的使用（v-for v-show v-if v-else v-for v-on v-bind v-model等）

1.数据绑定

使用Mustache语法：

<；/文本>

使用v-bind命令：

2.事件绑定

<模板>

<脚本>

导出默认值{

name:'测试'，

方法：{

doThis（消息）{

每个警报({

消息：消息

});

}

}

}

（4） 注册和登录

1.注册界面链接：点击此处查看。

注册代码