当前位置: 首页 > 图灵资讯 > 技术篇> 案例22-面向对象的原型设计

案例22-面向对象的原型设计

来源:图灵教育
时间:2023-06-02 09:35:21

一、背景介绍

面向对象的思想只能用于后端编写代码的过程,也可以用于前端的原型设计。当我们开发需求时,我们会发现有很多相似之处,比如弹出框和下拉列表。如果我们在每个地方写下拉框的样式代码,效率会很低。如果后期调整,调整的位置也很多,很可能有改变不了的地方。这样,我们的工作效率就会很低。

二:思路&方案

提高我们前端的工作效率:包装类似的功能或样式。使用时可以直接引用,引用后也可以根据业务场景进行调整。这样,我们就做了一项工作,相当于每次都需要写下拉框或其他部件。

三:过程

案例22-面向对象的原型设计_下拉列表

下拉列表是我们在进行前端设计时非常常用的组件。此时,我们可以将下拉列表包装成组件,页面需要直接引用。引用组件的宽度和高度后,可以进行调整。以下是下拉列表的引用。

案例22-面向对象的原型设计_前端_02

案例22-面向对象的原型设计_前端_03

四:总结

面向对象的想法无处不在,不仅可以应用于后端代码。也可以应用于前端组件。第一次包装看似复杂,但在重用后代码或组件时提高了工作效率。总的来说,效率提高了。