前后端分离的开发模式，前端需要向后端请求数据（ajax请求），但实际开发过程中，前后端会约定一份接口文档，但前后端开发进度并不一致，当后端没有完善接口功能时，前端需要在本地模拟数据返回，此时需要使用到mockjs。安装mocknpminstallmockjs--save-dev创建mock文件夹mock下创建index.ts、types.ts以及你需要使用到的模块的.ts文件。mock文件夹inde.ts文件代码：importMockfrom'mockjs'import{MockParams}from'./types'importapifrom'./api'//需要遍历的请求constmock
为了熟悉vue3+ts的开发风格，搭建的一个仿小红书的WebApp（已开源）;持续迭代中......gitHub仓库：https://github.com/xxljunjun/vue3-webApp线上地址：http://www.xxljunjun.com/redbook一、搭建项目npminitvite@latest踩坑：vite项目需要node版本大于16！！！通过vite@latest创建的是vite3.0.7的版本npmrundev启动项目二、配置路径别名踩坑：vite中不支持require()语法！！！编辑vite.config.ts//如果报错就安装：npminstall--sav
简介原型模式（PrototypePattern）是一种创建型设计模式，使你能够复制已有对象，而无需使代码依赖它们所属的类，同时又能保证性能。这种模式是实现了一个原型接口，该接口用于创建当前对象的克隆。当直接创建对象的代价比较大时，则采用这种模式。如果你需要复制一些对象，同时又希望代码独立于这些对象所属的具体类，可以使用原型模式。作用利用已有的一个原型对象，快速地生成和原型对象一样的实例。跳过构造函数的约束，便于提升性能。实现步骤创建原型接口，并声明克隆方法。使用new运算符调用原型版本的构造函数。将子类构造函数的直接调用，替换为对原型工厂方法的调用。UML Java代码基础原型抽象类//Sha
简介模板方法模式（TemplateMethodPattern）也叫模板模式，是一种行为型模式。它定义了一个抽象公开类，包含基本的算法骨架，而将一些步骤延迟到子类中，模板方法使得子类可以不改变算法的结构，只是重定义该算法的某些特定步骤。不同的子类以不同的方式实现这些抽象方法，从而对剩余的逻辑有不同的实现。以此基于公共的模板，来实现实现不同的功能。模板模式适用于一些复杂操作进行步骤分割、抽取公共部分由抽象父类实现、将不同的部分在父类中定义抽象实现、而将具体实现过程由子类完成。对于有多个子类具有共有的方法，且逻辑相同，可以考虑作为模板方法。作用相同的部分父类给出统一的模板，子类大量复用，从而节省代码
一、前言前段时间学习了ts，于是用脚手架搭了个vue3.0+ts的项目，引入详细步骤及语法校验报错解决办法，整理下遇到的问题以及解决办法，分享给大家。二、使用1.引入tsQ:在vue项目中编写tsx函数式组件提示报错。在没有引入ts的项目中，写tsx语法提示报错。无法使用JSX，除非提供了“–jsx”标志。ts(17004)A:先检查是否安装ts，cmd输入tsc-v，显示了版本号即安装了ts；未安装则执行npminstall-gtypescript，全局安装ts；下载依赖包yarnaddtypescript@vue/cli-plugin-typescript；添加tsconfig.json配
起因一个feature开发,结果需求评审、工时预估,简直是事故级别的.最后,迫于无奈,全组人都得上去救火...今天,帮忙改bug的时候,发现新checkout下来的代码,还带着新鲜的语法错误...简直大无语.翻了遍代码,发现很多地方都存在Array.reduce类型重载相关的问题,简单记录一下解决过程.排查过程大家的vscode都不装语法提示插件么?代码挂着红线,就扔代码库了???抽时间,得把hook安排上了//业务代码不方便外流,简单写了个demo,问题原因相同constnums=[1,2,3,4,5];constsum=nums.reduce((pre,cur)=>{return[...p
云原生场景下数据总线需求场景及挑战数据总线简介数据总线作为大数据架构下的流量中枢，在不同的大数据组件之间承载着数据桥梁的作用。通过数据总线，可以实时接入来自服务器、K8s、APP、Web、IoT/移动端等产生的各类异构数据，进行统一数据管理，进而实现与下游系统的解耦；之后可以异步实现数据清洗、数据分发、实时计算、离线计算等计算过程，进而将结构化后的数据投递到下游的分析、归档系统，进而达到构建清晰的数据流的目的。广义上，数据采集与接入、传输链路、存储队列、消费计算、投递等都属于数据总线的范畴，整体上可以分为采集接入层、管道层、计算层。通过数据总线，可以轻松达到如下目的：解耦生产者与消费者：消费方
前言：今天在项目中遇到了后端接口参数类型和接口返回值需要修改的场景，由于这个函数在很多页面都用到了，就导致改完相关api函数的时候TS疯狂报错，所有的参数和返回值都需要跟着改，一时间头疼。正当我手足无措的时候，突然想到之前看vue源码的时候看到函数重载的使用，于是我第一次在项目中使用了函数重载，完美解决了我的问题。一.场景再现我们先不要想函数重载是什么意思，我们从具体场景一步一步去了解这个名词的含义，你会理解的更深刻。假设现在后端有一个接口，可以通过一个ID来获取用户信息。那么前端对应的api可能就有这样一个函数，现在还有一个接口，就是通过很多个ID来获取很多个用户的信息。那么这个函数就可能被
本文整理来自深入Vue3+TypeScript技术栈-coderwhy大神新课，只作为个人笔记记录使用，请大家多支持王红元老师。一.代码规范1-集成editorconfig配置.editorconfig文件有助于为不同IDE编辑器上处理同一项目的多个开发人员维护一致的编码风格。#Editorconfiguration,seehttp://editorconfig.org#表示是最顶层的EditorConfig配置文件root=true[*]#表示所有文件适用charset=utf-8#设置文件字符集为utf-8indent_style=space#缩进风格（tab|space）indent_s
接上一篇h265web.js同时播放多个视频，修改官方example中player.js并重新编译,这里使用vue2.x封装最新版本h265web.jsv20220916tag【注意:后面有新版本了，tagv20220916之前的版本内存溢出我只想到定时刷新页面来解决，之后的版本未曾尝试过，自行测试】也就是这个：image.png其实h265web.js作者在demo中提供了vuedemo的，如下：image.png分别是VueCli和Vite创建的，这都不是重点，重点是demo里面的播放器很简陋，可以看到里面都是简单的播放暂停，而且没有样式。image.png这样对于初学者来说不够友好，有没
