1. 首先将 avalon 的 js 库文件引入相关页面,也可以使用 cdn:2. 本例子使用的是 springmvc,orm :iBATIS,数据库: oracle。相关配置和 avalon的使用没有关系这里不做介绍3. 数据库表4. 实体类5. iBATIS 映射配置6. 查询:根据上图的流程,页面请求后台,跳转页面,页面在初始化完后发送 ajax异步请求前往后台请求数据,数据类型如图,将数据赋值给 vm 然后进行循环数据生成列表。7. 新增:a) 点击新增按钮,跳转到新增页面,将页面表单进行 avalon 双向绑定b) 提交发送 ajax 请求,通过 vm.$model 获取到 vm 中的数据c) 因为后台已经建立了对应的实体类并且存在 get、set 方法,所以后台可以直接用对象接收,iBATIS 中也建立了关系映射,所以也可以直接从对象中获取属性值8. 修改a) 点击修改按钮跳转后台根据 id 查询到要修改的数据b) 将查询回来的对象回显到页面,avalon 有双向绑定功能,将表单与 vm 绑定后,只需要在vm 中进行赋值即可,可通过 el 表达式进行回显c) 将修改的数据提交,同新增,但是有一个地方需要注意,请往下看9. 删除