【实习40天-60天】odoo前端框架的学习

前言

  • Odoo 是一个开源框架,针对 ERP 的需求发展而来,适合定制出符合客户各种需求的 ERP 系统和电子商务系统
  • 但是正因为是框架,且是一个集成框架,别人的界面与代码早已完成
  • 所以在别人的代码上修改(二次开发),对我来说是一个很大的挑战

odoo前端的组成

odoo运用的框架

    • odoo前端是一个很老的框架,名叫 backbone,在以前也是很流行的
    • backbone的特点:轻,兼容性好。缺点:相比流行框架比起来学习成本高
    • 但当年用来实现 MVC 的选型:jquery, underscore template, Model, Router 随着浏览器和 JS 语言的发展落后了。
    • View 层被 React, Vue 等组件化的库所取代。
    • Model 层被 redux, vuex 等状态管理所取代

一个魔改的backbone

    • odoo中的backbone是被魔改过的,但是思想还是在backbone中
    • 但修改odoo的前端需要结合odoo的view中的xml,js继承扩展等,总之一言难尽

更改字段为一个图表需要四步

    • view视图中,字段继承widget修改字段属性
    • 继承tree视图,并修改扩展原生的tree视图
    • model 层传参给前端view层

最终效果展示

经过20多天来的自学与探索,odoo前端的修改与扩展理解达到30%

修改字段变为图表

在tree视图上拓展widget,且实现自定义搜索

总结

  • backbone 虽然是老牌框架,在如今的前端上面并不流行
  • 但是前端的学习并不是说不流行了就淘汰了,不学了
  • odoo 前端backbone的学习还在继续,虽然他复杂,他不友好,但是让我深刻的了解,他与其他的前端框架不一样在哪,为什么backbone会逐渐的被替代,backbone更像是面向对象
  • 虽然目前为止我只接触了vue的基础,对vue的理解不深刻,不知道vue的强大
  • 如今实习了60多天,从今日开始终于要 从魔改的backbone中融合vue了,我会在odoo中慢慢的融入vue的思想,做一个大胆的尝试~

原文地址:https://www.cnblogs.com/Muyangya/p/11460768.html

时间: 2024-08-30 09:19:39

【实习40天-60天】odoo前端框架的学习的相关文章

前端框架Vue学习的心得记录(过渡&动画)

目标:深入了解Vue框架(2.x版本)的组件 方法:通过看Vue的官方手册(Vue官方网站) 内容:本博客记录一些学习Vue中的心得,便于日后启发.(过渡&动画)(未完成,待继续) 注:遇到一些不懂的函数等,可以看官网的API参考. 正文; 一.概述 Vue 在插入.更新或者移除 DOM 时,提供多种不同方式的应用过渡效果. 包括以下工具: 在 CSS 过渡和动画中自动应用 class 可以配合使用第三方 CSS 动画库,如 Animate.css 在过渡钩子函数中使用 JavaScript 直

前端框架Vue学习的心得记录(可复用性&组合)

目标:深入了解Vue框架(2.x版本)的可复用性和组合 方法:通过看Vue的官方手册(Vue官方网站) 内容:本博客记录一些学习Vue中的心得,便于日后启发.(可复用性&组合)(未完成,待继续) 注:遇到一些不懂的函数等,可以看官网的API参考. 正文: 一.混入 二.自定义指令 三.渲染函数&JSX 四.插件 五.过滤器 原文地址:https://www.cnblogs.com/xinkuiwu/p/12011219.html

前端框架Vue学习的心得记录(工具)

目标:深入了解Vue框架(2.x版本)的工具 方法:通过看Vue的官方手册(Vue官方网站) 内容:本博客记录一些学习Vue中的心得,便于日后启发.(工具)(未完成,待继续) 注:遇到一些不懂的函数等,可以看官网的API参考. 正文: 一.单文件组件 二.单元测试 原文地址:https://www.cnblogs.com/xinkuiwu/p/12015020.html

前端框架开始学习Vue

 定义基本Vue代码结构 1 v-text,v-cloak,v-html命令 默认 v-text没有闪烁问题,但是会覆盖元素中原本的内容,插值表达式只会替换自己的占位符, <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <script src="vue.js"> &l

前端框架开始学习Vue(二)

1 根据关键字实现数组的过滤 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" type="text/css" href="css3.3.7/bootstrap.css"/> </head> <

Web前端框架学习成本比较及学习方法

就项目中自己用过的前端框架的学习成本比较与学习心得分享 刚工作时间不长只用过这几个框架下面是难易程度比较: 不论哪个web前端框架, 究其本质都是把页面的数据传递给后台服务器语言(如java)进行处理, 后台取出的数据把它显示在页面上不就这么简单么; 弄清楚这其中的提交方式(特别点就ajax方式), 参数传递, 事件机制然后在看懂API; 那么不管用什么web框架开发都是很顺心的, API在手通吃所有;  前提是一定要看懂API , 总是去问别人不会有多大进步的, 自己多看API文档; 学习成本

博主收藏的前端框架,极力推荐!

收藏的几十个前端框架,需要的博友们,自己把握. 再次感谢分享的人! 1.http://demo.mycodes.net/houtai/hangkongdaili_admin/ 2.http://demo.mycodes.net/houtai/H-ui.admin/ 3.http://demo.mycodes.net/houtai/Ylsat_admin/ 4.http://demo.mycodes.net/houtai/HTML5_shop_admin/ 5.http://demo.mycode

【CSS】扁平化都是纸老虎,看怎么抛弃前端框架在IE6扁平化

Bootstrap确实是一个好的前端框架,但是这东西就是任性,只支持IE8以上的浏览器, 国外还有一些其他不错的框架,但是连WIN7默认的浏览器IE8都不支持,那留你何用,甚至Bootstrap这一优秀的框架在其V4版本也矫情起来了,开始不支持IE8, 把我大天朝的IE6放哪里去? 扁平化总是给人高大上的样子,好像必须用前端框架实现不可,自己写前来根本无从下手, 其实根本不是, 都是CSS样式,有什么不可能实现呢? 好,光吹没用,跟大家看些实际的东西. 一.按钮 按钮在网页中常见得不能再常见,那

超实用!9个目前流行的MATERIAL DESIGN前端框架

http://www.uisdc.com/material-design-frameworks-top-9 谷歌推出的Material Design风格已见有一些APP UI采用,视觉和交互体验都很棒,对于想尝试这个风格但又不懂实现一些效果的前端设计师们,可以试试今天分享的9个目前流行的Material Design前端框架 >>> 这些前端框架的设计元素齐全,按钮.表单.布局及常用JS特效代码也有齐了,支持Responsive Design,还有的可以结合Bootstrap使用,相当不