这次给大家带来avalon前端项目中使用解析,avalon前端项目中使用的注意事项有哪些,下面就是实战案例,一起来看一下。
1 小例子数据循环

| 序号 |
项目名称 |
开始时间 |
合同金额 |
支付金额 |
支付比例 |
| {{$index}} |
{{el.pro_name}} |
{{el.crt_time}} |
{{el.contract_money|number(2)}} |
{{el.pay_money|number(2)}} |
0
|
{{el.pay_money / el.contract_money *100|number(2)}}%
|
2 vm之间可以互相拿值

Document
{{@a}}
{{@a}}
{{@b}}
3 内置指令
$id, vm的名字
$watch, 用于添加监听函数
$fire, 用于触发监听函数
$events, 用于储存监听函数
$model, 返回一个纯净的JS对象
$element, 2.0新增, 当我们用ms-controller,ms-important指定一个VM的作用域,对应元素节点会放到这个属性上.
$computed, 2.2.1新增,用来集中定义计算属性
4 计算属性
4.1 get案例
Document
{{@fullname}}
4.2 set案例
Document
{{@firstName}}
{{@lastName}}
4.3 计算属性模糊搜索案例
Document
{{@test1}}
|
|
|
5 对象data里放数据学vue,不过vue方便得多
Document
{{@data.firstName}}
{{@data.lastName}}
立即学习“前端免费学习笔记(深入)”;
mallcloud商城
mallcloud商城基于SpringBoot2.x、SpringCloud和SpringCloudAlibaba并采用前后端分离vue的企业级微服务敏捷开发系统架构。并引入组件化的思想实现高内聚低耦合,项目代码简洁注释丰富上手容易,适合学习和企业中使用。真正实现了基于RBAC、jwt和oauth2的无状态统一权限认证的解决方案,面向互联网设计同时适合B端和C端用户,支持CI/CD多环境部署,并提
下载
6 操作数组方法
pushArray(el), 要求传入一数组,然后将它里面的元素全部添加到当前数组的末端。
remove(el), 要求传入一元素,通过全等于比较进行移除。
removeAt(index), 要求传入一数字,会移除对应位置的元素。
removeAll(arrayOrFunction), 有三种用法,如果是一个函数,则过滤比较后得到真值的元素,
如果是一数组,则将此数组中与原数组相等于的元素全部移除;如果没有任何参数,则全部清空。
clear(),相当于removeAll()的第三种方法,清空数组的所有元素。由于需要同步视图的缘故,不能通过vm.array.length
= 0的方法来清空元素。
ensure(el),只有当数组不存在此元素时,才添加此元素。
set(index, el),用于更新某一索引位置中的元素,因为简单数组元素的数组,是不会转换它的元素
toJSON(), 用于取得数组的$model, 2.2.2新添加的方法
6.1操作数组例子pushArray(不重复添加)
Document
6.2 remove()数组操作例子删
Document
{{el}}
7 if显示隐藏包括站位隐藏
Document
{{@aaa}}
{{@aaa}}
Document
10 事件
animationend、
blur、focus change、input、
click 、 dblclick、 、 keydown、 keypress、keyup、
mousedown、 mouseenter、 mouseleave、 mousemove、 mouseout、
mouseover、 mouseup、 scroll、 submit
简写 :click-1="@fn(el)" :click-2="@fn(el)"
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
推荐阅读:
本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
Java JVM 原理与性能调优实战
本专题系统讲解 Java 虚拟机(JVM)的核心工作原理与性能调优方法,包括 JVM 内存结构、对象创建与回收流程、垃圾回收器(Serial、CMS、G1、ZGC)对比分析、常见内存泄漏与性能瓶颈排查,以及 JVM 参数调优与监控工具(jstat、jmap、jvisualvm)的实战使用。通过真实案例,帮助学习者掌握 Java 应用在生产环境中的性能分析与优化能力。
java用途介绍
本专题整合了java用途功能相关介绍,阅读专题下面的文章了解更多详细内容。
xml格式相关教程
本专题整合了xml格式相关教程汇总,阅读专题下面的文章了解更多详细内容。
PHP WebSocket 实时通信开发
本专题系统讲解 PHP 在实时通信与长连接场景中的应用实践,涵盖 WebSocket 协议原理、服务端连接管理、消息推送机制、心跳检测、断线重连以及与前端的实时交互实现。通过聊天系统、实时通知等案例,帮助开发者掌握 使用 PHP 构建实时通信与推送服务的完整开发流程,适用于即时消息与高互动性应用场景。
网站特效
/
网站源码
/
网站素材
/
前端模板