- 博客(49)
- 收藏
- 关注
RSS订阅原创 浅析微前端框架 single-spa
将一个单体大型应用，转化为多个可以独立运行、独立开发、独立部署、独立维护的应用的聚合。解决的问题：1、随着项目迭代应用越来越庞大，难以维护。2、跨团队或跨部门协作开发项目导致效率低下的问题。以 single-spa 为例，我们一起配置一下改造入口文件 main.js更改试图文件环境配置文件修改路由文件在 package.json 的 script 中添加命令启动应用，此处演示子应用嵌入所以用子应用模式运行项目
2022-11-09 17:47:55
893
原创 vue列表垂直无缝滚动
实现新闻列表的轮播（如下图）上代码封装的so-marquee.vue<template> <div class="marquee-wrapper" :style="{ width: realWidth + 'px' }" > <div id="marqueeContainer" class="marquee-container" :.
2021-02-03 17:54:46
1804
1
原创 vue.config.js配置sass-loader
vue.config.js中配置sass的全局变量入口遇到问题“sass-loader”: “^8.0.0”sass-loader如上版本号时，配置如下：module.exports = { css: { loaderOptions: { sass: { // 全局sass变量 //sass-loader 8.0.0以前版本（包含） prependDat
2021-02-02 10:44:01
9497
6
原创 css命名规范记录
一、常用 CSS 样式名称这里引用一下掘金作者 冷石Boy 的 css 样式名称包裹类： container, wrapper, outer, inner, box, header, footer, main, content, aside, page, section, block状态类： primary, secondary, success, danger, warning, info, error, Link, light, dark, disabled, active, checked,
2021-01-28 10:01:04
124
原创 收集文件功能的系列软件
前言：收集多人提交的文件，汇总后下载压缩包。可以实现此功能的软件收集如下。（此处比较的是各软件免费版，vip金主请忽略）软件网址优缺点坚果云收件箱https://workspace.jianguoyun.com/inbox/home优点：页面清爽，可以设置收取文件的简介和一些规则；可分享外链收集，且上传人不用注册账号；单个上传文件大小无限制缺点：有流量限制，当月上传的流量不超过1G，通过你分享链接未注册用户上传文件消耗你的流量。下载流量限制当月3G快速创建收件夹ht.
2020-12-23 10:51:38
1433
原创 vue3.x篇四——vue router和vuex的使用
vue3.x搭载的是vue-router 4 和 vuex 4本节代码demo地址：demo项目链接1、demo图2、vue-router的用法首先要引入vue-router暴露的apiimport { useRoute, useRouter } from "vue-router";然后在setup()函数中做相应操作setup(){ const route = useRoute(); const router = useRouter(); const curRout.
2020-12-22 17:19:25
605
1
原创 vue3.x篇三：v-model用法
注意：v-mode在vue2.x和vue3.x中的使用方法有异同。本节代码demo地址：demo项目链接1、比较vue2.x和 vue3.xvue2.x：允许组件自定义用于 v-model 的 prop 和事件。但是，这仍然只允许在组件上使用一个 model。vue3.x：双向数据绑定的 API 已经标准化。（一个组件上允许使用多个model）具体的vue升级变动，请阅读官方vue3中文文档： vue3.x中文文档2、demo图3、代码Model.vue文件（父组件）<te.
2020-12-21 15:01:11
3726
1
原创 vue3.x篇二：生命周期
vue3.0的生命周期<template> <div>生命周期</div> <button @click="update">版本号{{version}}</button></template><script>//按需引入import {ref, onBeforeMount, onMounted, onBeforeUpdate, onUpdated, onBeforeUnmount, onUnmounted
2020-12-17 10:51:44
175
4
原创 vue3.x篇一：搭建项目
利用vue-cli3以上版本脚手架搭建vue3.0项目首先确保你的vue-cli脚手架版本号在3以上，我这里用的v4.5.9。升级vue-cli请参考：升级vue-clivue -V查看脚手架版本号项目创建步骤如下：1、初始化一个vue3-demovue create vue3-demo2、直接选择Default (Vue 3 Preview)也可，只是生成的项目结构单一。我此处选择自定义3、按需添加你想要的插件（vue3.0搭载的Vuex和Router均为4.0版本的）4、选
2020-12-17 09:50:46
551
原创 用dart-sass(sass)代替node-sass
问题需求：node-sass在npm安装的时候大概率的会安装出错，或下载时间过长，因此考虑用dart-sass来替换1、如果安装了node-sass首先需要卸载npm uninstall node-sass2、安装dart-sassnpm install sass sass-loader -D3、如果项目之前用到/deep/需要替换为::v-deep，否则会报错...
2020-11-30 14:19:15
4323
原创 git用户名密码记忆命令
问题描述：git用户名密码想要重置，然后利用了命令行重置，之后每次都要进行用户名密码输入，相关命令行如下git config --system --unset credential.helper //重置用户名密码git config --global credential.helper store //用户名密码记忆...
2020-10-12 14:25:42
165
原创 gitignore
在项目中有些配置文件不需要提交，但是有同学在后面开发中发现在.igonore文件中无论如何都无法忽略某些文件的提交。原因在这里：已经维护起来的文件，即使加上了gitignore，也无济于事。----那么如何解决呢？方式如下git update-index --assume-unchanged 要忽略的文件夹/文件夹下文件名比如我要忽略项目下.idea文件夹下所有xml文件,idea下都是xml文件（我用的webstorm）：git update-index --assume-unchanged
2020-08-20 14:58:38
170
2
原创 git 命令
git add -A //添加要提交的文件git commit -m xxx //git的提交描述git pull //拉取远程代码git push //提交commit的本地代码//修改最近一次的git commit git commit --amend //进行vim修改
2020-08-03 10:47:27
88
原创 element-ui组件中的事件传参+自定义传参
问题描述：vue中利用第三方组件，组件中的事件有时会返回参数，在保留原来的参数基础上增加自定义参数实现：（此处以element-ui中的checkbox为例）<el-checkbox :label="d_itm.id" @change="(flag,$event)=>_deptItemChange(flag,$event,d_itm)">{{d_itm.orgName}}</el-checkbox><!--flag 和 $event 是组件原始参数-.
2020-07-10 15:15:52
1833
原创 2020.6面试经记录
一、css集合1、margin合并（兄弟元素）和塌陷（父子元素）解决方法：(1)position:absolute/fixed(2)display:inline-block;(3)float:left/right(4)overflow:hidden2、flex布局a、设置在容器上面flex-direction：row | row-reverse | column | column-reverse;flex-wrap：nowrap | wrap | wrap-reverse;flex-f
2020-07-09 10:33:01
181
原创 el-tree Scoped Slot自定义内容
问题描述element-ui中的el-tree组件自定义内容实现。依靠Scoped Slot<el-tree :expand-on-click-node="false" :props="{label:'orgName',isLeaf: 'leaf',children:'childList'}" node-key="id" :data="treeData" ref="tree" highlight-current show-overflow-tooltip @node-click.
2020-07-07 17:36:17
4693
原创 vue $router 打开空白页
默认是替换当前页this.$router.push('/index')可以用如下方法进行空白页打开let xtbl = this.$router.resolve('/host/wait')window.open(xtbl.href, '_blank');
2020-07-02 15:49:41
1348
原创 js判断object为空
js判断object为空1、es6判断let data = {}let lengh = Object.keys(data).length //将data中的key值取出，lengh === 0 表示data为空2、利用JSONJSON.stringify(data) == '{}'此文章是自己学习时的笔记，只供参考，如有问题欢迎赐教！...
2020-04-07 11:22:06
155
原创 升级vue-cli3（爬坑记录）
emmm,突然想升级下vue的版本，然后要升级node和npm，在此做下笔记1、升级vue首先查看版本号，然后要把旧的版本卸载掉，重新安装新的版本# 查看版本号vue --version# ORvue -V# 卸载（1.x 或 2.x）npm uninstall vue-cli -g# OR vue-cli是 (1.x 或 2.x)yarn global remo...
2019-11-29 17:49:01
474
原创 Js根据数值的大小来编辑颜色色值
&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html lang=&quot;en&quot;&amp;gt;&amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt
2019-02-18 11:20:58
7216
7
原创 git命令笔记
1、克隆代码到本地 git clone <链接地址>2、克隆指定分支代码到本地 git clone -b <分支名称> <链接地址>3、查看分支 git branch //查看本地分支 git branch -a //查看仓库所有分支4、切换分支 git checkout -b <分支名称>...
2019-01-04 14:05:05
108
原创 vue开发微信H5——动态改变页面
需求说明动态的修改微信的title，vue2.0开发，基于微信安装插件 npm install vue-wechat-title --save在项目中引入（main.js） Vue.use(require('vue-wechat-title'))进行路由配置（index.js） routes: [ { path: '/', n...
2018-11-22 16:59:36
614
原创 vue笔记记录(二)——发起请求
开发过程中和后台进行数据的交互，需要用到axios 1、安装axios和qs$ npm install axios -s //安装axios$ npm install qs -s //安装qs2、在main.js中引入import axios from 'axios'import qs fr...
2018-07-27 15:18:59
369
原创 vue笔记记录(一) —— 搭建项目
利用webpack脚手架搭建vue项目npm install -g vue-clivue init webpack my-projectcd my-projectnpm installnpm run dev至此，一个简单的vue项目就搭建好了。大致目录结构如下：.├── build/ # webpack config fi...
2018-07-18 15:53:16
201
转载 assets与static的区别
assets与static的区别 相同点：资源在html中使用，都是可以的。不同点：使用assets下面的资源，在js中使用的话，路径要经过webpack中file-loader编译，路径不能直接写。assets中的文件会经过webpack打包，重新编译，推荐该方式。而static中的文件，不会经过编译。项目在经过打包后，会生成dist文件夹，static中的文件只是复制一遍而已。简单来...
2018-07-17 09:22:58
423
转载 Webstorm最新破解
在打开的License Activation窗口中选择“License server”，在输入框输入下面的网址：http://idea.wrbugtest.tk/点击Activate2018.6.25 亲测。 转载：(参考链接)(https://blog.csdn.net/daniel_tzq/article/details/80675638)...
2018-06-25 09:37:16
694
翻译 返回上一级页面
需求重现 页面跳转时，点击返回有时会陷入循环，无法逐级向上返回解决办法 js文件var historyUtils = { add : function (url) { var historyArray = historyUtils.getLocal(); if (!historyArray) { history...
2018-06-11 16:18:50
4245
原创 手机验证码倒计时
需求重现 绑定手机号，或者手机号注册账户时，需要验证码，验证码点击后60s内禁止操作解决办法 html文件<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport"
2018-06-11 15:50:53
349
原创 微信公众号开发(1)——微信H5图片点击放大预览
微信公众号开发踩了很多坑，在此处以作笔记。需求重现 微信公众号H5网页，图片点击放大实现预览，这是微信自己的接口，Android可以完美的自己实现，可是ios却不能实现。解决办法html文件var imgObj = $("#packageDetailBox img"); //这里改成相应的对象js文件/*此方法用来解决，微信H5图片点击放大*//...
2018-06-09 11:50:46
8474
原创 js获取地址栏传递的参数
//公共获取地址栏信息——传参数，结果是单独的参数内容function GetQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r !...
2018-04-11 13:53:33
184
原创 移动端弹窗禁止页面滚动
我们要阻止页面滚动，那么何不将其固定在视窗（即position: fixed），这样它就无法滚动了，当蒙层关闭时再释放。 position: fixed应该不用对大家过多介绍了吧， 当然还有一些细节要考虑，将页面固定视窗后，内容会回头最顶端，这里我们需要记录一下，同步top值。let bodyEl = document.bodylet laytop = 0function stop...
2018-04-09 15:01:34
614
原创 图片预览
考虑到用户体验， 网页的图片上传数据库前，先预览是很有必要的一个步骤，第一可以给用户带来安全感，第二防止图片文件有问题而提交到数据库，占用存储资源。那么要实现预览有两种方式：一种是用window.URL.createObjectURl方法对选择的图片数据（图片数据可以勉强理解为input的value）生成一个blob对象路径，第二种是用获取 FileReader读取器。那么无论那种方法，首...
2018-04-08 09:28:18
145
转载 export，import ，export default分别是什么
首先要知道export，import ，export default是什么ES6模块主要有两个功能：export和import export用于对外输出本模块（一个文件可以理解为一个模块）变量的接口 import用于在一个模块中加载另一个含有export接口的模块。 也就是说使用export命令定义了模块的对外接口以后，其他JS文件就可以通过import命令加载这个模块（文件）。这几个都...
2018-03-15 13:02:47
446
原创 css实现手风琴动画效果
利用css写手风琴样式，简简单单5步实现 下面贴代码<style> .accordion-box{ width: 100%; height: 500px; margin:0 auto; overflow: hidden;} .accordion-box div{ width: 25%; float: left; transition: all 1s...
2018-03-09 11:59:07
2013
转载 微信小程序如何引用外部icon
首先在阿里巴巴矢量图标库添加需要的icon，点击下载至本地 然后在下载的东西里找到这个文件iconfont.css 在自己的小程序里建一个iconfont.wxss的页面，建议放在公共样式里，自己可以找到路径就行，把之前iconfont.css的内容放到iconfont.wxss里面。 使用 import导入，或者放在app.wxss里面全局，反正得导入它。 页面用的时...
2018-03-08 10:01:04
5146
2
转载 输入一个URL到页面呈现其中发生的过程-------http过程详解
在我们点击一个网址，到它能够呈现在浏览器中，展示在我们面前，这个过程中，电脑里，网络上，究竟发生了什么事情。服务器启动监听模式 那我们就开始了，故事其实并不是从在浏览器的地址栏输入一个网址，或者我们抓着鼠标点击一个链接开始，事情的开端要追溯到服务器启动监听服务的时候，在某个未知的时刻，一台机房里普普通通的刀片服务器，加上电，启动了操作系统，随着操作系统的就绪，服务器启动了 http 服务进程...
2018-03-05 10:07:37
376
原创 jquery的hover事件(闪烁)bug
在前端开发中用的较多的是jquery,之前遇到一个问题,一个下拉的jquery下拉菜单效果,hover上去,一直闪动,用mouseovermouseout好好的,当时没搞定,今天逛论坛看到一个方法,可以行.只怪自己之前看jquery api的时候不是很仔细。解决闪动 可以使用Stop()stop([clearQueue],[jumpToEnd])概述停止所有在指定元素上正在...
2018-03-01 11:45:59
3107
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人