- 综合排序
- 最热优先
- 最新优先
- 来自专栏APICloud AVM多端开发教程
Avm.js前端框架的优势
AVM（Application-View-Model）是APICloud推出的一个跨端的高性能 JavaScript框架，更趋近于原生的编程体验，它提供简洁的模型来分离应用的用户界面、业务逻辑和数据模型 AVM（Application-View-Model）是APICloud基于标准H5子集设计的DSL中间语言编程框架，提供包含虚拟DOM和Runtime的编程框架avm.js以及多端统一编译工具，完全兼容 Avm核心库只关注终端差异、虚拟DOM、组件化和数据绑定，与其他重量级框架不同的是，Avm不需要太多的外部依赖，仅需要组件化、数据驱动等更现代化框架的能力。其可具备如下能力： 1. Virtual DOM：通过虚拟DOM，渲染到不同终端，充分尊重系统特性，为不同终端执行差异处理，实现高效渲染； 2. APICloud DSL使用Vue方式定义组件或页面： Avm.js跨端框架的优势配图1.png APICloud DSL使用兼容React JSX方式定义组件或页面： Avm.js跨端框架的优势配图2
2.5K10发布于 2021-03-10 - 来自专栏APICloud AVM多端开发教程
使用APICloud AVM框架开发预约应用
*本文来自沐瑶派投稿 前段时间跟朋友一起搞了一个预约的项目，前端用的APICloud的AVM框架做的，后端用的php开发的，用的tp5框架，没几天就搞出来了。 2、AVM框架的使用 为什么选择AVM？ 易用：有 Vue、React 基础，可快速上手，配套专用的开发工具APICloud Studio3。 多端：一次开发，多端渲染，一个技术栈搞定移动端开发。 CSS框架，要是没啥选择推荐可以用AUI，这个框架有CSS基础的一看就知道写的啥，而且特别好修改。实在不行了直接改源码。 APICloud官网组装了一套vant的，https://docs.apicloud.com/Client-API/AVM-Components/readme.md （2）ajax网络交互 / 四、项目后台 这块是自己写的php后台，用的tp5框架。 tp5下的fastadmin框架，可以根据fastadmin一键生成简单后台，数据库文件为： 后台接口代码 <?
76720编辑于 2022-01-21 - 来自专栏APP开发教程
APICloud AVM框架打造数字滚动组件
今天用APICloud AVM框架打造数字滚动组件。组件中用到的核心功能点是，background-position属性设置背景图像的起始位置。 easy-count-up:during="during1":customNum="customNum1":justify="justify1"></easy-count-up><text>随机抽取{customNum2} 位数的号码牌</text><easy-count-up:customNum="customNum<em>2</em>":justify="justify<em>2</em>"></easy-count-up></view></template rightduring1:5000,//数字滚动一次的时间 单位毫秒customNum1:3,//数字的个数justify1:'left',//号码数字位置 center,left,rightduring2: 3000,//数字滚动一次的时间 单位毫秒customNum2:5,//数字的个数justify2:'right',//号码数字位置 center,left,right}},methods: {}}</
67630编辑于 2022-07-19 - 来自专栏案例分享
APICloud AVM框架 纵向滚动通知栏组件
AVM（Application-View-Model）前端组件化开发模式基于标准Web Components组件化思想，提供包含虚拟DOM和Runtime的编程框架avm.js以及多端统一编译工具， 完全兼容Web Components标准，同时兼容Vue和React语法糖编写代码，编译工具将Vue和React相关语法糖编译转换为avm.js代码。 /CylXLfCKIdCCBnN98qMXcCwLogRQLEnhNo2Jxw/p5QzQkEkLHjBwB6RlU8XBwftJzCs6q5ygC8ByJ7yphaGA9UC4SIm7Qct001Txkg07v2PpD8WlU4SpxkbOoccX9Q0VAGSPcaLxIh0AumYqBSjAR2dTrueyr56gC2MUrAdhXR6DE8ZDmF51R0lADObEd8JmZMAbhORTRqjDd +H2Wp98AVYSPwxaTxcZmwB4E2HN0dsbNV0BsaI6LNSmT+8bdQ961dHGWCxULpv7b2iLHuZLu5Md4UFIuAvCUqDOQ2ib5saOdV2xP3Vz3TVWShI4uJY71zsKjPeBYnrmYQpJJsgMhlsgplIiLxk6RKLPMVkviyF2yR5 +5pbimuKe9klv1gaquwi+2dgU2C6AsC3m9P5cejmvfytQEsNzPR39I8WyxtoBhoriH2y8Yj//ypw/ByjboB1MNsqFFipYyErfMvOTeGQKdiHZsAAAAASUVORK5CYII
3.4K20编辑于 2022-09-02 - 来自专栏APICloud AVM多端开发教程
使用APICloud AVM框架实现App导航栏菜单
效果展示 APICloud的AVM官方框架中有一个 frame-group的组件，在此组件的基础上，将栏目导航中view标签换成了 scroll-view标签，并设置成允许横向滚动。 2、计算向右滚动的距离，实现活动frame-group中滑动页面的同时，导航栏也跟着向右滑动。 2、如果在样式中有margin或者padding，在计算的时候需要把这些属性设置的值考虑进去。 frameGroup.load({ frames: frames }); }, data() { return{ menuList: ['page1', 'page2' .item { width: 15%; align-items: center; } .item-title-active{ border-bottom: 2px
1.2K10编辑于 2022-05-05 - 来自专栏APICloud AVM多端开发教程
使用APICloud AVM框架封装app日历组件
month, date } = this.data.current; let maxDate = this.getDaysByMonth(year, month); // 预防其他月跳转到2月 ，2月最多只有29天，没有30-31 date = Math.min(maxDate, date); let instance = new Date(year, month, date
74520编辑于 2022-04-06 - 来自专栏APICloud AVM多端开发教程
使用APICloud AVM框架封装通讯录组件
由于很多项目中都会用到通讯录，所有就封装了一个通讯录的组件，实现了可通过字母检索，拨打电话功能。
39310编辑于 2022-05-09 - 来自专栏APP开发教程
实例|APICloud AVM框架封装滑动单元格组件
今天介绍APICloud AVM框架封装滑动单元格组件的实例。 let endX = e.detail.x;this.disX = this.data.startX - endX;//如果距离小于按钮一半,强行回到起点if ((this.disX*5) < (wd/2) demo-easy-swipe-cell',apiready(){//like created},data() {return{list:[{id:'1',content:'关于开展什么活动的通知'},{id:'2'
61020编辑于 2022-07-19 - 来自专栏案例分享
APICloud AVM框架 封装SKU（商品规格选择）组件
AVM（Application-View-Model）前端组件化开发模式基于标准Web Components组件化思想，提供包含虚拟DOM和Runtime的编程框架avm.js以及多端统一编译工具， 完全兼容Web Components标准，同时兼容Vue和React语法糖编写代码，编译工具将Vue和React相关语法糖编译转换为avm.js代码。 ;justify-content: flex-start;align-items: center;}.easy-sku_guige-item--default{background-color: #f2f2f2 ;border: 0.5px solid #f2f2f2;border-radius: 18px;padding: 8px 18px;margin-right: 10px;margin-bottom: 通过控制平台右上方的模块Store进入，然后选择AVM组件。编辑编辑找到对应模块进入，也可通过搜索栏，通过组件名称关键字进行检索。编辑 进入模块详情，点击立即下载下载完整的组件安装包。
1.7K30编辑于 2022-09-02 - 来自专栏APICloud
使用APICloud AVM多端框架开发课程表功能
一、效果展示二、功能实现的思路本项目基于APICloud的AVM多端框架编写，因此需要想办法去构造特定数据、然后再改变数据，本项目核心业务就是课程数据的处理，难点就是课表的添加。 项目主要针对大学课表进行设计，课程很多地方存在不确定性，如课程周次数可能连续也可能不连续、上课时间可能1-2节也可能一整天、上课教室也可能不一样，因此课程的数据结构如下图。 星期对应的是left参数也有7种样式，上课节次对应top参数有12种样式具体css如下：.bg-1 { background: linear-gradient(#facea8, #fe8979)}.bg-2 #dfc3fe, #dd65c7)}.bg-7 { background: linear-gradient(#c8e65f, #7abafb)}.week-1 {left: 12.5%;}.week-2 {rs.name}}</text> <text class="course-room">{{rs.room}}</text> </view></view>（2）
54820编辑于 2022-06-07 - 来自专栏APP开发教程
实例|APICloud AVM框架开发视频会议APP
APP开发采用的APICloud平台的AVM多端应用开发框架，使用 avm.js 一个技术栈可同时开发 Android & iOS 原生 App、小程序和 iOS 轻 App，且多端渲染效果统一；全新的 App 引擎 3.0 不依赖 webView，提供百分百的原生渲染，保障 App 性能和体验与原生 App 一致；现有 api 直接映射兼容小程序接口，延续已有开发习惯；后台使用的PHP的thinkphp框架 2.加入会议，可通过会议大厅找的会议列表直接加入，也可通过输入会议编号加入会议；加入会议的前提是会议已在进行中。 AVM框架里官方就集成了websocket。 clearCache(){api.clearCache(() => {this.data.cache=0.0;api.toast({msg:'清除完成'})});}AVM组件使用项目中使用了很多的AVM
1.2K30编辑于 2022-09-01 - 来自专栏APICloud AVM多端开发教程
APICloud AVM框架列表组件list-view的使用、flex布局教程
avm.js 是APICloud 推出的多端开发框架。 使用 avm.js 一个技术栈可同时开发 Android & iOS 原生 App、小程序和 iOS 轻 App，且多端渲染效果统一；全新的 App 引擎 3.0 不依赖 webView，提供百分百的原生渲染 /image/nav_tab_2.png' } } var listView = document.getElementById('listView'); /image/nav_tab_2.png' } } var listView = document.getElementById
86440编辑于 2022-02-09 - 来自专栏APP开发教程
实例|APICloud AVM框架封装省市区级联选择弹框
目前场景设定的是3级，可根据自己的实际需求改成2级或者4级或者更多级。数据源就是典型的树形结构的JSON数组数据。 今天介绍用APICloud AVM框架封装省市区级联选择弹框。 :'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAAXNSR0IArs4c6QAAAZRJREFUeF7t2z1KxEAYgOF3D2Old7AVsdlirS3sBEE9gB5gYQtLC3utxZPYeRgZ2CKEXSGT C0B1fAaAWfHRAWbHRwZoEh8VoFl8RICm8dEAmsdHAhCJjwIgFh8BQDTeO4B4vGcAlXivAGrxHgFU470BqMd7AjCJ9wJgFu8BwDTeGuAS+Bp+ot6fq/0rYA3wBtyOAFTjrQFegOcBgHq8NcDV/qepU6DE3x2YDuKXMu0LVGEtAFVsiW7qfgT8AYVYcEHJaD3BAAAAAElFTkSuQmCC console.log(JSON.stringify(e));this.data.selectArea = e.detail[0].text+'/'+e.detail[1].text+'/'+e.detail[2]
1.1K30编辑于 2022-07-19 - 来自专栏APICloud AVM多端开发教程
使用APICloud AVM多端框架开发仿微信通讯录功能
2、按字母分类排序后的好友数据结构 ? 3、字母导航数据结构 ? 四、功能实现的思路 本项目基于APICloud AVM框架编写，因此思路要转变下比如标签的用法、CSS样式表的写法、项目的目录结构、dom的操作等都不一样了，完全是Vue、React的编程思维。 /res/avatar/tx7.jpg" }, { "id": "2", "nick_name": "666", "avatar": "../.. userArr = userArr.sort((a, b) => { let value1 = a.unicode; let value2 = b.unicode; return value1 - value2; }); } } }, 代码执行顺序 ?
85830编辑于 2022-05-09 - 来自专栏APICloud
使用APICloud AVM多端框架开发消防检查助手App项目实践分享
App开发采用APICloud AVM框架，后台采用PHP。 2、动态权限动态全选的获取在第一个初始化的页面执行即可。本项目中需要用到存储、相机、相册3个权限。 /user/login.stml',title: '',hideNavigationBar:true});}api.hideProgress();});}}8、表单提交、回显表单使用的事AVM官方的 from result.jcqkdj_2:this.data.jcqkdj_2; this.data.jcqkdj_3 = result.jcqkdj_1? result.jcqkdj_2:this.data.jcqkdj_2; this.data.jcqkdj_3 = result.jcqkdj_1?
81020编辑于 2022-06-14 - 来自专栏APICloud AVM多端开发教程
使用APICloud AVM多端框架开发企业移动OA办公的项目实践
功能介绍 1、考勤打卡签到，加班打卡签到 2、办公流程申请、审批 3、通知下发、短信消息提醒 4、个人考勤记录查询，按月统计、钻取查询明细 思维导图 技术要点 Flex布局，amap地图应用，消息推送 /images/toolbar/icon-user-selected.png" }] } } 接口调用 将接口调用和接口配置分别封装了2个JS插件，model.js和config.js , "type": 2, //– 消息类型，1:消息 2:通知 "platform": 0, //0:全部平台，1：ios, 2：android " JSON.stringify(ret)) // console.log(JSON.stringify(err)) }); } }); } Flex布局 flex布局在AVM www.ruanyifeng.com/blog/2015/07/flex-grammar.html 通知公告 由于通知公告的内容是在后台通过富文本编辑器编辑的内容，其中会有样式布局的元素，不再是单纯的文字展示，这里使用了AVM
1.8K30编辑于 2022-05-16 - 来自专栏APICloud AVM多端开发教程
使用APICloud AVM框架开发人事档案管理助手app实战
开发工具采用 APICloud Studio3，基于VSCode的（PS：比基于Atom的autio2好用太多）； 数据库采用sqllite，没有使用UI框架，个人觉得AVM本身支持的flex布局配合自写 CSS样式，完全可以实现市面上所有的ＵＩ框架的元素，这个取决于个人功力。 personinfo.stml', title: '人员信息', pageParam:{ id:id } }); } } } </script> 3、表单提交 采用AVM APICloud强大之处在这里进行了淋漓尽致的体现，通过AVM及原生模块无法实现的功能，可以再用H5的方式来实现！牛逼！！！！ length ; i++) { p2 += psw2[i].index + psw2[i].index; } return
70540编辑于 2022-04-02 - 来自专栏若川视野
跨平台开发框架到底哪家强？5款主流框架横向对比！
1.5 AVM AVM 是由 APICloud 研发的一套跨端的 JavaScript 框架，全称（APICloud-View-Model），写法类 Vue 也兼容 React JSX，有双向绑定，组件化和状态管理支持 其他使用 JavaScript 技术开发的框架，AVM，RN，Ionic 其实都还不错。 而且纵观所有框架，文档写的最细致还是 RN 和 Flutter，AVM这三家。 从性能上看AVM 的开发体验和编译速度，性能表现都非常好，虽然是国产的框架但是不比国外的要差，其次是Flutter，RN，最后是 Ionic 和 NativeScript。 其他框架中 AVM和 Ionic 各有优势，但是从使用体验，上手难度，社区情况来看，国内的 AVM 肯定更适合国内开发者一些，毕竟有本土化，云端集成，而且debug体验也很惊艳。
11.4K20编辑于 2022-01-07 - 来自专栏我的开发历程
前端如何低门槛开发iOS、Android、小程序多端应用
现如今跨平台开发技术已不是什么新鲜话题了，在市面上也有一些开源的框架可供选择，然而技术成熟、产品服务健全的平台并不多，其中也不乏推陈出新的框架值得关注。 比如最近使用的AVM，由APICloud迭代推出的多端开发框架，基于JavaScript，兼容多语法，如果是Vue、React的用户，可直接上手，没什么学习成本，具备虚拟DOM，可一次编写多端渲染；主要是 为什么学习AVM框架？ 结合AVM官网的介绍和我自己的一些实践经验，我总结了一系列AVM的特性，我想这些内容足以让你主动去学习AVM框架了。 AVM中的页面介绍： AVM中的页面称为stml页面，一个典型的 stml 文件代码如下： 1. <template> 2. <view> 3. <template> 2. <text data-name="<em>avm</em>" onclick="doThis">Click me!</text> 3. </template> 4.
1.2K60编辑于 2021-12-15 - 来自专栏魔术师卡颂
前端开发App避坑指南
既然可能存在风险，那我们可以不使用WebView，通过其他方式来进行渲染，比如使用APICloud推出的JavaScript跨平台开发框架avm.js，其升级后的App引擎不依赖WebView，提供百分百的原生渲染 此外avm.js与Vue语法类似，并兼容 React JSX，APICloud官网还提供了大量的案例和教程，学习成本低，非常适合开发者快速使用。 组件丰富，可自定义开发组件，目前提供系统级基础组件31个，ACT多端框架组件库和开发者贡献多端组件120多个。 学习成本低，上手容易 avm.js框架语法和Vue语法类似，并兼容React JSX。如果是Vue、React的用户的话，将更易上手avm.js，几乎不需要学习成本。 2、一个移动app应用可以直接基于云平台提供的能力完成后端工作。 3、一个网站可以展示来自APICloud上的数据，网站的前端也可以放到APICloud平台。
96130发布于 2021-11-17
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号