- 博客(42)
- 收藏
- 关注
RSS订阅原创 ts的动态路由
把component转为函数，组件路径要写对export function convertRouter(asyncRoutes: any) { asyncRoutes = asyncRoutes.filter((item: any, index: Number) => index === 0) return asyncRoutes.map((route: any) => { if (route.component) { if (route.component ===
2022-03-15 14:58:10
853
原创 react-app 加入装饰器（react7）
react7npm run eject出配置npm install @babel/plugin-proposal-decorators --save-devpackage.json "babel": { "presets": [ "react-app" ], "plugins": [ [ "@babel/plugin-proposal-decorators", { "legacy": true
2022-03-11 17:41:46
393
原创 JavaScript，ECMAScript，commonJS版本概述及babel，webpack
JavaScript：网页脚本语言，潜入到网页中，使得浏览器可以与网页互动（1）借鉴C语言的基本语法；（2）借鉴Java语言的数据类型和内存管理；（3）借鉴Scheme语言，将函数提升到"第一等公民"（first class）的地位；（4）借鉴Self语言，使用基于原型（prototype）的继承机制。所以，Javascript语言实际上是两种语言风格的混合产物----（简化的）函数式编程+（简化的）面向对象编程。语言的标准化：ECMAScriptECMAScript简称eses5与es3保
2022-03-03 10:59:54
587
原创 模块化commonJs和es6，babel和webpack
module.exports和exports是属于commonJs规范export和export default是ES6模块规范commonjs模块输出的是值的浅拷贝，输出后被改变，其他引用模块不会改变同步存在本地硬盘，加载快node.js运行时加载浏览器不支持ES6模块输出的是值的引用 (输出后被改变，其他引用模块会改变)编译时输出接口webpack的tree-shaking只能作用于ES6模块，就是因为ES6模块在编译时就能确定依赖node 运行文件不支持es6语法浏览器
2022-03-02 17:34:41
860
原创 三角形，斜线，表头css实现方法
三角形可通过border来实现，斜线可用transform:rotate(9deg)border可用来画三角形，主要是因为，长方形，四边的border可以单独设置颜色和粗细，border:1px solid #000且border在content盒模型是不占宽高，当该长方形的宽高设置为0时，就剩下了border，就得到了三角形，其他的设成透明，就得到单个三角形.border { width: 0; height: 0; border-style:solid; // 上
2022-03-01 10:58:08
1033
原创 设计模式——依赖注入
面向对象OOP的一种思想，控制反转（Spring框架IOC容器）：借助第三方来解耦。控制反转的一种设计模式：依赖注入依赖注入：非自己主动初始化依赖，而通过外部来传入依赖的方式// 在types.d.ts定义接口export interface IUserData { id: number title: string timestamp: string | number platforms: string[] disableComment: boolean}// 使用imp
2022-03-01 09:29:39
518
原创 安装包之win32-x64-93\fibers.node
node-sass最新版本https://github.com/sass/node-sass/releases
2022-02-28 18:14:45
778
原创 node版本管理——nvm
nvm list availablenvm install 14.19.0nvm listnvm use 16.14.0nvm uninstall 11.13.0
2022-02-28 18:00:01
93
原创 class和style绑定
class可变化的是样式名，style是属性值class绑定简单，单个class直接用三元表达式 <i class="el-icon-top" @click="changeCondition(1, 2)" :class="queryForm.sortOrder == 1 && queryForm.sortType == 2? 'd-arrow-active': 'd-arrow'" />复杂，多个class用数组的形式id="u-wave-btn"class
2022-02-28 12:02:39
103
原创 富文本插件
基础使用VabQuill的图片上传是直接从本地拿图片转为字节的，需要重新改进封装，将图片上传后，再返回网址，在富文本里显示网址，关键代码：quill配置里的image和imgClick方法quill配置里的image让VabQuill里的图片上传改为FileUpload组件，imgClick图片回显到content里template<el-form-item class="vab-quill-content" label="内容" prop="content"> <VabQui
2022-02-28 11:06:30
917
原创 自适应布局兼容pc和移动端
css% vh calc不使用rem，因为工程化html的font-size是会影响全局，如果改为较容易计算的100px，全部都得改，框架的内容也得改，较为麻烦ps：em是根据父级元素的font-size来计算局部自适应用%和vh来计算，再配合calc减去固定的边距@media适配不同的屏幕js监听屏幕的变化window.addEventListener('resize', this.handleLayouts)window.removeEventListener('resize', t
2022-02-28 10:58:35
361
原创 本地模拟服务器XAMPP
模拟线上环境，访问图片Apacheconfig：httpd.confDocumentRootRequire all grantedMySQLconfig:my.ini[mysqld] : skip-grant-tables将代码放到htdocs
2022-02-28 10:50:01
422
原创 ts类型声明
变量声明let和constlet a: string;函数参数和返回值声明function fn(a:string) :string{return ‘’}// 没有返回值用void（undefined和null）// error和while无法达到的终点用never。。。常用类型// string,number,boolean,// any,unknown(赋值时不会改变别的变量的类型)// 数组let a: number[];// 元组,确定数组的length和每个元..
2022-02-28 10:44:55
544
原创 图片img的object-fit
object-fitobject-fit: cover; // elementUI的avatar默认，充满不变型object-fit: contain; // 不充满不变型object-fit: fill; // 充满变型object-fit: none; // 充满不变型,cover更好些object-fit: scale-down; // 不充满不变型
2022-02-28 10:41:32
149
原创 高德地图和截图
地图高德地图配置如下：import VueAMap from "vue-amap";Vue.use(VueAMap);VueAMap.initAMapApiLoader({ key: "6db0150adff8e519375d773094610fa1", plugin: [ "AMap.MapType", 'AMap.Geolocation', //定位空间，用来获取和展示用户主机所在的经纬度位置 'AMap.Autocomplete', //输入提示插件
2022-02-23 20:23:23
644
原创 下载文件vue
下载文件window.location.href=‘http://www.baidu.com/down/downFile.txt?name=资源文件’;这种情况下载时:文件名资源文件会中文乱码，解决办法：encodeURI(fileUrl, “utf-8”);var newFileUrl=encodeURI(‘http://www.baidu.com/down/downFile.txt?name=资源文件’, “utf-8”);hrefwindow.location.href = this.dow
2022-02-23 20:22:09
231
原创 uniapp-bug
open IDE端口号微信开发者没有网络图片显示宽根据屏幕比例 vw居中.mask { position: fixed; top: 0; left: 0; z-index: 2148; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.7); transition-duration: 300ms; }.uni-popup-canvas{ backgr
2022-02-23 20:20:56
266
原创 vue-bug
浏览器VM1910:1 Uncaught SyntaxError: Identifier ‘pluginnamearr’ has already been declared谷歌浏览器抽风？Vue访问不到接口网络不稳定的原因代理的接口写错是端口被占用node版本低的原因data里定义了，但console显示未定义data里有语法错误，未定义等vscode编译版本npmnpm ERR! ERESOLVE unable to resolve dependency
2022-02-23 20:20:24
572
原创 el-tree
<el-tree class="tre" :icon-class="icon" show-checkbox node-key="nid" :default-checked-keys="checkIds" :default-expanded-keys="expandIds" ref="tree" highlight-cur
2022-02-23 20:14:14
1163
原创 element-UI
常用组件vue-admin里封装的组件，插件等，统一注册在framework/vab/index.js里，main.js再导入framework/vab，就可以全局使用framework/vab里的内容了如果想全局使用自己封装的组件，可以放到vab/components里，比如多个页面需要用到的头像组件Avatar，这里有另，也可以直接使用element-UI的组件，放在了vab/plugins里，全局的样式方法注册在framwork/plugins/vab，里面是对element-UI的一些方法重新
2022-02-23 09:46:44
1410
原创 前端软件（一）
文章目录前言一、VScode二、1.2.总结前言一、VScode先下载node.js，配置好环境变量]只能相对路径导入！...
2021-08-16 09:22:20
106
原创 登录和瀑布流
登录和瀑布流是两个非常常用的功能，本文将讨论这两个功能的具体的设计思路目录登录权限管理根据数组构建树树的遍历瀑布流图片排列懒加载登录表单展示（单例模式）验证登录，前端验证（策略模式）登录成功后，各模块的显示（发布订阅模式封装，父组件向其他组件父组件或孙组件等传值）最简单用户输入用户名和密码等，浏览器将其发给服务器，服务器验证成功，通知浏览器更新保存session的cookie，并返回登录成功后的页面给用户端点登录sso权限管理常规权限模型RBAC（Role-Based
2021-05-05 21:58:44
72
原创 html+css布局及BFC渲染
html+css布局，简单理解，在html上放合适的标签，对标签用上合适的css布局样式，包括float,position,flex等。有的时候，可能出现塌陷等不符合预期的布局，极大可能是没有产生BFC独立的块级渲染区域。目录标签盒模型布局flex功能盒子水平垂直居中flex（ie10+）positionjs-position左右固定中间自适应flexpostition圣杯布局(float)双飞翼(float)calc(ie9+)pc端布局（兼容）移动端布局渲染BFC标签是什么？标签语义化：合
2021-05-05 21:55:54
67
原创 js运行机制，设计模式及语法
JavaScript作为一门运行在浏览器上的弱类型，解释型语言。本文将先从作用域和事件循环机制来讨论js的运行机制，再讨论三种设计模式如何用js实现及相关应用，接着是关于js的一些语法，主要分为逻辑，数据类型和函数，再深入讨论ES6的语法，最后是一些模块封装和常用模块了解，导入等目录作用域概念预编译作用域链闭包防抖节流防抖函数节流函数懒加载单例模式内存泄漏eventLoopjs内存模型js代码执行机制同步任务与异步任务宏任务与微任务设计模式单例模式ES5 (闭包)ES6 (类静态方法）策略模式发布
2021-05-05 21:50:17
167
原创 从宏观的角度讨论网络应用怎么运行及其前端代码系统编写和优化
一个网络页面，网络应用的前端开发，首先明白前端代码在浏览器上运行，访问服务器提供的接口，接收服务器传来的数据，展示在页面上。本文从较为宏观的角度来讨论前端开发中的一些课题。首先，是网络基础HTTP协议，浏览器与服务器之间的通讯xhr，跨域问题接着，浏览器的渲染，缓存，兼容，同时会涉及到部分服务器端然后，性能优化，从页面开启到代码运行期间，如何减少消耗浏览器和服务器端的资源，让页面更快加载出来另外，前端开发的模式，框架，模块，主要是关于vue框架最后，是项目的管理，前后端联调，打包，上线部署通过
2021-05-05 21:25:40
720
原创 python提供接口
文章目录1. pip命令找不到问题描述：解决方案：2. api接口提供解决跨域问题问题描述：解决方案：```javascript```1. pip命令找不到问题描述：pip : 无法将“pip”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。解决方案：添加环境变量：C:\Users\MI\AppData\Local\Programs\Python\Python36-32\Scripts直接在前面加上位置C:/Users/MI/AppData/Local/Pro
2021-02-20 22:01:40
1097
原创 uniapp概述
文章目录前言环境搭建HBuilderXvue/clicss组件api生命周期数据绑定一些问题前言Union Application基于Vue.js的前端框架，开发规范同小程序一套代码即可编译到iOS,Android，H5，小程序等多个平台其他优势：支持npm与自定义组件，社区活跃，版本迭代快开发软件推荐：HBuilderX(APP开发版),自动生成，还有提示等，开发最便捷npm install -g @vue/cliuniapp规范：结构templatescripts
2021-02-20 21:46:49
615
原创 小程序后端
文章目录前言node.js语法框架云开发后台管理框架前言后台写接口：node.jskoa2云开发后台管理框架：@vue/cli elementnode.js写接口RESTFUL API小程序，网页，webapp调用第三方平台提供的技术产品服务node 文件 运行语法let 变量名 = require(路径)module.exports = route.routes()导出接口fs读取文件框架expresshttps://koa.bootcss.com/
2021-02-17 14:35:11
878
原创 sass与scss
sass，scss：css的编程语言，vscode编译插件Live Sass Compilersass没有{}，scss有scss如下：$变量:18px;属性变量#{ $变量}支持运算嵌套-------&代替父元素@root{}-------定义动画.box{width:$变量；height:2 * $变量；border-#{ $变量}：}...
2021-02-17 14:26:07
115
原创 js语法
文章目录前言一、简写二、使用步骤1.引入库2.读入数据总结前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考一、简写三元条件？true：false；箭头函数（ES6）var c = () => {let}闭包示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。二、使用步骤
2021-02-14 22:36:26
203
1
原创 css3
文章目录前言一. 基础1. 语法规则2. 新选择器3. 新盒模型4. 新单位二. 图形1. 文本，边框，背景1）文本阴影text-shadow（立体感）2）text-overflow3）边框圆角border-radius4）边框阴影box-shadow5）边框图片6）背景2. 渐变，过渡，2D3D变换，动画1）线性渐变2）径向渐变3）线性渐变4）过渡5）2D transform6）3D transform7）动画animate3. 在线字体图标4. 渐进增强三.布局1. 伸缩布局2. 多列布局3. 媒体查询
2021-02-13 19:01:48
197
1
原创 前后端分离开发模式与Vue框架
文章目录前言一、概况1.MVVM模式和技术2.标准3.协作工具二、布局1.2.flex弹性布局3.响应式布局三、Vue2.读入数据总结前言前后端分离后，前端负责渲染html页面，后端返回前端所需的数据（json，xml）。后端开发的视图即为接口或API，前端可访问接口来对数据进行增删改查，展示。前后端分离后，再加上多种设备显示的不同，对前端的要求更加灵活，响应式，弹性布局等显得尤为重要。最后，也会综合讲讲很好用的vue前端框架极其局限等。一、概况1.MVVM模式和技术MVC:model
2021-02-11 20:42:57
1046
1
原创 布局
文章目录前言一.弹性布局flex二.响应式布局三.自适应布局（js先分不同设备）四.电脑网页缩放窗口%和@media五.手机常用布局总结前言一套前端页面，如何在大大小小的屏幕里都完美显示，不出现“排版”问题呢？这就是今天要讨论的问题。之前说到自动生成前端代码，说了那么多人工前端不可替代的地方，今天又来了一个布局。总不能机械的生成10几个静态页面吧，再一一去改为动态页面，还是过于繁琐所以，又有了一套页面用所有的“偷懒”，布局是个好东西。一.弹性布局flexflex+remdisplay：
2021-02-11 02:06:30
388
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人