最近忙于重构项目，今天周末把在重构中的一些思想记记：一、javascript的组件开发：基类的封装由于这次重构项目需要对各种组件进行封装，并且这些组件的实现方式都差不多，所以想到对组件封装一个base基类(javascript没有类的概念，暂且这样叫把)，由于javascript没有原生的类和继承的实现，所以我们首先需要对javascript简单的实现以下类和继承(见一下代码注释实现方案改于jq作
转载
2023-10-10 11:47:20
110阅读
组件化开发01-组件化开发01-组件化开发的基本使用02-全局组件和局部组件03-父组件和子组件04-组件的语法糖注册方式05-组件模块的分离写法06-组件中的数据存放问题07-组件通信-父组件向子组件传递参数08-组件通信-子组件向父组件传递事件09-组件访问-父访问子-children-refs10-组件访问-子访问父-parent-root02-插槽slot01-插槽的基本使用02-具名插
转载
2024-01-19 22:44:29
60阅读
Vue.js教程-组件化开发前言Vue组件化什么是组件化Vue单页面开发的解释组件化思想组件的使用原理实际开发中的使用-父子组件父子组件传递数据父传子-props用法子传父-this.$emit()自定义事件父组件直接获取子组件的数据this.$childrenthis.$ref子组件直接获取父组件的数据-this.$parent非父子组件之间的数据传递总结 前言本章介绍为什么要进行组件化开发、
转载
2023-10-11 14:45:12
47阅读
作为一名前端工程师，写组件的能力至关重要。虽然javascript经常被人嘲笑是个小玩具，但是在一代代大牛的前仆后继的努力下，渐渐的也摸索了一套组件的编写方式。 下面我们来谈谈，在现有的知识体系下，如何很好的写组件。 比如我们要实现这样一个组件，就是一个输入框里面字数的计数。这个应该是个很简单的需求。 我们来看看，下面的各种写法。为了更清楚的演示，下面全部使用jQuery作为基础语言库。 最简
转载
2023-09-21 21:01:55
218阅读
一、引言项目中经常用web弹层组件-layer，其常见的代码如下： 使用的时候很方便，弹窗的宽高、内容、标题、关闭按钮等弹窗的状态我们都可以通过配置参数配置。layer弹层组件用同一套代码来满足不同的弹窗层表现的需求，这便是组件开发的强大之处。那么，什么是组件开发、为什么要采用这种开发形式、怎么进行组件化开发呢？下面就来一探究竟吧。 二、什么是组件化开发当多组功能相同的对象,有
转载
2023-10-10 08:00:50
77阅读
组件化开发和模块化开发实际上是两种编程思想，也可以被认为是两种解决方案。组件化开发注重重用，可以用作实现基础架构的技术方案。举个例子：加入现在我需要实现一个几何图形库，包括图形的生成、修改、删除等基本功能。按照组件化的开发思想来说，所有的几何图形都有共同的方法，即新增、编辑和移除。我们这里就可以先定义一个几何图形的基本类型。一般说来，通常从点、线、面三个方面分别对几何图形进行基类的定义处理。至于不
转载
2023-08-28 13:15:30
87阅读
现如今，虽然多数的web应用都使用了大量的JavaScript，但如何保持客户端功能的专注性、健壮性和可维护性依然是一个很大的挑战。 尽管其它编程语言和系统都已经将关注分离和DRY这样的基本原则视为理所当然的宗旨，但往往在进行浏览器端应用开发的时候，这些原则就被忽视了。 造成这一现象的部分原因是JavaScript语言本身就在不断挣扎的历史，在很长的一段时间内，它都难以获得开发者的认真关注和对待
转载
2023-11-08 19:58:59
71阅读
一、注册组件步骤解析 组件的使用分成三个步骤： 1.创建组件构造器 2.注册组件 3.使用组件 1.Vue.extend()： 调用Vue.extend()创建的是一个组件构造器。 通常在创建组件构造器时，传入template代表我们自定义组件的模板。 该模板就是在使用到组件的地方，要显示的HTML ...
转载
2021-09-13 22:00:00
223阅读
2评论
随着SPA，前后端分离的技术架构在业界越来越流行，前端需要管理的内容，承担的职责也越来越多。再加上移动互联网的火爆，各大公司也开始在前端投入更多的资源。在传统的开发模式中，不仅会有大量的资源冗余，而且因为项目中的交叉依赖太多，当出现技术方案变化时，IT无法做到渐进式的、有节奏地替换掉老的代码，只能一次性替换掉所有老代码，极大地提升了技术方案升级的成本和风险。并且业务的要求，UX的设计都需要等到开发
转载
2023-09-12 23:42:29
88阅读
1认识组件化 2注册组件 3组件其他补充 4组件数据存放 5 父子组件通信6 父级向子级传递 7子级向父级传递 8插槽slot 组件的使用分成三个步骤： 创建组件构造器 注册组件 使用组件。 我们来看看通过代码如何注册组件 查看运行结果： 和直接使用一个div看起来并没有什么区别。 props的值有 ...
转载
2021-09-13 21:25:00
335阅读
2评论
组件（Component）是自定义封装的功能。在前端开发过程中，经常出现多个网页的功能是重复的，而且很多不同的页面之间，也存在同样的功能。 而在网页中实现一个功能，需要使用html定义功能的内容结构，使用css声明功能的外观样式，还要使用js来定义功能的特效，因此就产生了把一个功能相关的[HTML、 ...
转载
2021-10-01 21:13:00
294阅读
2评论
简介为什么要组件化开发？在项目庞大，业务复杂的app下，如果不采用组件化的开发方式，或许会因为功能区分不明显，导致各个功能块、页面相互依赖，相互调用太多导致耦合度高。而采用组件化可以使我们的模块有明显的划分，强制将我们的功能耦合度降低。组件化开发项目结构组件化就是要将项目的各个功能拆成多个模块，就比如抖音来说，有视频播放的app主模块，登录注册模块，视频选择发布模块，相机拍摄特效模块等。演示效果：
转载
2023-07-24 16:31:42
81阅读
组件化开发概述 软件代码难以读懂和维护，业务逻辑分散在多个代码模块中软件系统面对着的需求不断变化，再次开发一个新的软件成本高因此，我们应该“重用”，而不是每次都“从头开始”大量的软件系统中都存在着功能重复的情况，因而开发可重用的软件组件是可行的。
组件（Component）：
是指可以用于重用、开发和部署的软件模块。
组件化开发（CBD：Component-based
转载
2023-08-08 16:12:09
122阅读
08 设计组件：DeignKit 组件桥接设计与开发规范在上一模块“配置与规范”中，我主要介绍了如何统一项目的配置，以及如何制定统一开发和设计规范。接下来我们将进入基础组件设计模块，我会为你介绍一些在 iOS 开发过程中，工程化实践需要用的组件，比如设计组件、路由组件。除此之外，我还会聊聊在开发中如何支持多语言、动态字体和深色模式等辅助功能，让你的 App 既有国际范，获取更多用户，还能提升用户体
转载
2024-05-14 19:29:32
231阅读
记得第一次实施项目组件化时，遇到的最大困扰就是，组件之间的通信问题。例如：怎么从这个组件跳转到另一个组件的页面；组件之间怎么传递数据；怎么获取其他组件的数据或服务；组件怎么通知其他组件响应某个事件；1. 页面跳转统一采用路由在Android中，页面跳转都是通过startActivity来实现的。但是我们组件化之后，上层的业务组件之间是不能相互依赖的，也就是说现在无法通过startActivity来
转载
2023-11-15 21:44:15
40阅读
本文主要讲解框架实现原理，如果只是想了解一下如何使用，可直接到github上查看README文档前言首先说明一下，本文将讲述的组件化与业内的插件化(如：Atlas, RePlugin等)不是同一个概念组件化开发：就是将一个app分成多
转载
2024-01-09 22:40:17
64阅读
Vue工程化开发：组件化与模板化开发实践
下面我将为您展示一个完整的Vue工程化开发解决方案，融合了组件化和模板化开发的最佳实践。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="
iOS开发组件化开发的实现与优化
在移动互联网高速发展的今天，iOS开发的复杂性及项目规模不断扩大。如何有效地进行组件化开发成为了提升开发效率、降低维护成本的关键。本篇博文将向大家展示在iOS开发中实现组件化开发的过程中所遇到的问题、现象以及最终的解决方案和优化措施。
问题背景
随着业务迭代的加快，我们的iOS项目逐渐走向了复杂化。每个功能模块的独立性不足，导致了代码代码的耦合度过高，影响了
一、什么是模块？ 定义：具有相同属性和行为的事物的集合 在前端中：将一些属性比较类似和行为比较类似的内容放在同一个js文件里面，把这个js文件称为模块 目的：为了每个js文件只关注与自身有关的事情，让每个js文件各行其职 二、什么是模块化？CommonJS是什么？AMD和CMD又是什么？ ①模块化：
转载
2017-02-08 23:57:00
342阅读
# jQuery 组件化开发指南
在现代Web开发中，组件化思想越来越被广泛应用，jQuery作为一种流行的JavaScript库，也提供了组件化开发的便利。本文将帮助刚入行的小白理解并实现jQuery的组件化开发流程。
## 开发流程
下面是一个简单的jQuery组件化开发流程表格：
| 步骤 | 描述
