- 博客(64)
- 收藏
- 关注
RSS订阅
原创 Ant Design of Vue 中的Card 卡片的headStyle和bodyStyle设置
从官网上可以看到Card的相关使用和APIhttps://vue.ant.design/components/card-cn/这里可以看到headStyle 和 bodyStyle 的类型都是object，但是为它赋值的需要注意一些问题。如果只设置一个样式，可以直接在行内写<a-card title="title" :bordered=false :headStyle="...
2019-09-27 15:25:05
34019
原创 使用nvm-windows 安装和管理 npm 和 Node.js
1. 前言由于 npm 和 node.js 产品由不同的实体管理，更新和维护可能变得复杂。此外，Node.js 安装过程会将 npm 安装在只有本地权限的目录中。当您尝试全局运行包时，这可能会导致权限错误。为了解决这两个问题，许多开发人员选择使用 节点版本管理器 或 nvm 来安装 npm。版本管理器将避免权限错误，并将解决更新 Node.js 和 npm 的复杂性。但由于n(npm的管理模块)和nvm只能在Linux或者MacOS，所以npm 官网上推荐使用 nvm-windows（ 温馨提示，下载
2021-12-22 23:56:51
831
原创 验证字符串 and 限制数字输入框的最大最小值
1. 验证字符串中，不超过3个连续字母和不超过4个连续数字LxStr(str) { var arr = str.split(''); var flag = true; for (var i = 1; i < arr.length - 1; i++) { var firstIndex = arr[i - 1].charCodeAt(); var secondIndex = arr[i].charCodeAt(); va
2021-11-26 18:10:10
762
原创 监听鼠标 滚动条事件
window.addEventListener("scroll", this.handleScroll, true); //监听滚动事件handleScroll() { const dom = document.getElementsByClassName('contents') let sTop = dom[0].scrollTop // 滚动条位置， 滚动条在最顶端的时候， scrollTop=0 let cHeight = dom[0].clientHeight //.
2021-09-30 10:21:15
1207
原创 js 监听鼠标点击位置是否在指定区
$(document) 指定的是整个文档范围也可以根据具体情况，设置大范围的id或class去指定对应的大范围。// 指定点击的区域大范围为指定的id为box的盒子// $('#box').mouseup(e => {// 指定点击的区域大范围为整个document$(document).mouseup(e => { var _con = $('.btn_list'); // 设置目标区域 if (!_con.is(e.target) && _con.has(e
2021-09-22 14:36:00
2088
原创 html ＜img/＞ src图片路径不存在，显示指定的默认图片
1. 图片加载失败，出现图片碎片和提示文字（不美观）<img src="./xxx.jpg" alt="图片加载失败，显示提示文字">2. 使用onerror事件指定一张提示错误的图片代替显示不了的图片<img src="./xxx.jpg" onerror="this.src='./error.png'" alt="">3. 若指定的图片路径存在变量，则使用v-bind结合模板字符串的方式实现<img src="./xxx.jpg" :onerror="`thi
2021-09-06 09:56:18
1060
原创 使用鼠标当前坐标位置设置div盒子的位置
<!-- 外面容器盒子 --><div style="position: relative;" id="box"> <div id="moveDiv">需要定位的盒子</div></div>// js触发事件setIt() { var event = window.event||arguments[0]; // 获取鼠标相对文本窗口的坐标 - 容器相对偏移量 = 当前需要定位的坐标 var y = event.pag.
2021-08-30 17:52:28
661
原创 el-select值的回显，使element-ui的初始化时，框内显示label值
现象1：<el-select v-model="value" placeholder="请选择"> <el-option label="红米肠" value="1"></el-option> <el-option label="蒸排骨" value="2"></el-option></el-select>初始值返回，若value: ‘1’ 则回显 “红米肠”，但若value: 1,则回显“1”现象2：<el-
2021-08-25 10:38:38
2833
2
原创 http请求失败，如何获取失败返回的response内容
this.$axios.put('http://.....（请求地址）',{ data: data // 请求传递的参数 }) .then(res => { // 请求成功，执行该代码块 console.log(res.data, '请求成功返回数据'); }) .catch(err => { // 请求失败 console.log(err, '请求失败返回报错的信息err');
2021-08-10 10:15:14
1731
原创 解决elementUI multiple Select 抖动问题
现象： 使用elementUI 的select多选组件时，在Google浏览器下，添加多个选项后会出现输入框高度抖动变化的现象。F12查看代码发现撑开的input高度会在两个 高度值 来回变化，导致页面渲染出现抖动的现象。解决1在我的项目中未改动前.el-tag–mini的height值为20，将其修改为20左右（不能是20）的值即可//从框架源码解决问题/deep/ .el-tag--mini { height: 21px;}解决2：问题应该是谷歌浏览器版本问题。只需要给 el-tag
2021-06-22 16:43:32
3378
原创 Javascript 子网掩码转换（如： 255.255.255.0/24）
// 子网掩码转换 255.255.255.0/24// 255.255.255.0 转 24var netmask2CIDR = (netmask) => (netmask.split('.').map(Number) .map(part => (part >>> 0).toString(2)) .join('')).split('1').length -1;// 24 转 255.255.255.0var CDIR2netmask = (.
2021-06-22 11:56:07
1956
3
原创 js 在浏览器中创建或读取 tar 文件的 Javascript 库 -- tarballjs
git地址：https://github.com/ankitrohatgi/tarballjs.git
2021-06-03 23:03:08
1180
转载 基于xterm.js 实现Vue版本终端terminal
前端实现xtermnpm install --save xtermxterm-addon-fitxterm.js的插件，使终端的尺寸适合包含元素。npm install --save xterm-addon-fitxterm-addon-attachxterm.js的附加组件，用于附加到Web Socketnpm install --save xterm-addon-attachvue文件<template> <div id="xte.
2021-01-29 09:42:21
2278
原创 Blob（二进制）对象读取
var blob = new Blob(["i am a blob"]);var r= new FileReader();r.onload = evt => { console.log(evt.target.result);};r.readAsText(blob);
2021-01-29 09:34:45
470
原创 登录验证 Vue路由守卫
// main.js 文件中router.beforeEach((to, from, next) => { console.log(to, from, next); //返回到登录界面，清空所有session if (to.name == 'login') { sessionStorage.clear(); } //如果输入的路由地址不存在，返回登录页 if (to.name == null) { next({ path: '/' }); } else .
2021-01-17 20:42:59
287
2
原创 vue element-UI 更新输入数据但页面未及时渲染的问题
使用el-select时选中值改变但没有渲染变化在el-select上绑定change方法，使用this.$forceUpdate()强制更新一下select// HTML<el-select v-model="value" @change="changeSelect" placeholder="请选择"> <el-option v-for="(item, index) in options" :key="index"
2020-12-28 21:35:59
3374
原创 vue 解决position:fixed 遮盖下方元素问题
方法1：下方的元素第一个设置 margin-top为fixed元素的高度即可。方法2：在fixed元素后添加一个空的div盒子，并将高度设置为fixed元素的高度。延伸扩展：如果fixed高度不确定，该如何处理？需要动态获取盒子高度并监听其变化，然后动态设置元素的style。<div> <div id="header" style="position: fixed"> //设置fixed的元素 </div...
2020-12-23 18:55:07
8360
转载 Error: No PostCSS Config found in... 报错
项目在本地运行不报错，上传到 GitHub 之后，再 clone 到本地，执行：npm install安装完成之后再执行：npm run dev这时报错Error: No PostCSS Config found in...本以为是 GitHub 上传的问题，后开又试了两回，发现问题依然存在，于是就开始网上寻找办法。解决方案在项目根目录新建postcss.config.js文件，并对postcss进行配置：module.exports = { plugins: ..
2020-12-22 10:09:26
1328
原创 JS判断对象中是否存在某属性 、删除指定属性
1. 直接查找属性，判断undefinedvar str = {fname:"uw3c",lname:"js",age:10}console.log(str.fname);//uw3cconsole.log(str.sex);//undefined2. 使用 in 运算符，判断true 或 falsevar str = {fname:"uw3c",lname:"js",age:10}console.log('fname' in str);//trueconsole.log('sex.
2020-12-18 15:36:11
838
1
转载 获取时间的范围（前一周、前一个月、前一年）
我这主要是为了应用在layui的日期时间范围选择控件的初始值timeFrame(a, b, c) { var nowdate = new Date(); var oneweekdate = new Date(nowdate - c * 24 * 3600 * 1000); var time1 = nowdate.getFullYear() + '-' + (nowdate.getMonth() + 1) +
2020-11-17 16:52:37
633
原创 禁用layui动态创建的弹窗表单input输入框
禁用layui动态创建的弹窗表单input输入框window.layui.layer.open({ type: 1, title: 'Edit users', maxmin: true, //开启最大化最小化按钮 area: ['600px', '400px'], content: `<form class="layui-form" lay-filter="formEdit" action=""
2020-11-12 16:45:37
890
原创 后台返回的数据有回车换行符号，前端也要进行相应的换行显示
后台返回的数据有回车换行符号，前端也要进行相应的换行显示解决方法：使用<pre>或<code>标签，它们会自动识别和处理后台返回的换行符号。此外，超出容器外的内容需要进行换行处理的话，可以使用样式：white-space:pre-wrap;...
2020-09-01 16:34:20
2878
转载 Vue点击切换样式如何实现
Vue点击切换样式如何实现点击切换样式这种事情经常遇见，之前总是习惯用JQuery的方式，但是听说vue和Jquery混用是不好的，今天终于找了一下vue的实现方式了data中初始化一个值：isActive:-1在method中设置点击的方法：checkItem(index){ this.isActive = index;}在template中实现：<divv-for="(item,index)inlist" v-bind:class="{active:...
2020-08-17 18:39:21
584
原创 解决element-ui 表单from回车会刷新整个页面问题
原因：当form表单中只有一个input输入框的时候，键盘回车事件就会刷新页面，因为form表单把这个事件当成了是提交表单的操作解决：1.再写一个type为hidden的input标签2.在el-form中写一个属性：@submit.native.preven...
2020-07-30 12:02:58
987
原创 路由守卫
main.js编写路由守卫函数router.beforeEach((to, from, next) => { //路由守卫 if (to.name == 'Login') { sessionStorage.clear() //返回到登录界面，清空所有session next() } else if (to.meta.requiresAuth) { console.log(to.name) var res = sessionStorage.getIte
2020-06-17 16:23:38
122
原创 three.js 导入模型，解决渲染容器固定后模型会被拉伸的问题
init(){ // 这里只写出部分关键代码，具体的效果还需要自行参照官方文档实现 // 创建场景对象 scene = new THREE.Scene(); camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 1000); camera.position.set(2, 1, 8); ...
2020-06-02 15:27:48
1651
原创 解决three.js引用时，有些构造函数引用报错的问题
报错：[Vue warn]: Error in mounted hook: "TypeError: __WEBPACK_IMPORTED_MODULE_0_three__.OrbitControls is not a constructor"解决办法：在需要引入的组件中写下：import "three/examples/js/controls/OrbitControls"在three/examples/js/controls/OrbitControls.js文件中加入一行...
2020-05-13 17:55:11
3561
1
原创 git 操作命令
git init 初始化仓库，生成.git文件git add . 添加所有修改文件到暂存区git add filename 添加指定文件到暂存区git commit -m 'des' 将add过的文章提交到仓库，des为此次提交的描述，自定义git log 查看日志，显示最近提交的历史记录（加上--pretty=oneline参数可以直接显示版本号和提交描述简略信息），退出查...
2020-04-29 16:49:26
113
原创 git clone 时候出现Please make sure you have the correct access rights and the repository exists.问题解决
原因：git服务器没有存储本地ssh密钥解决方法：1. 切换成https的克隆连接2. 参考这位大神的博客https://blog.csdn.net/qq_36181310/article/details/88760623
2020-04-24 10:37:40
374
原创 Vue / keep-alive 组件缓存
在路由配置中设置meta属性export default[ { path:'/', name:'list', components: list, meta:{ keepAlive:true //需要被缓存的组件 }, { path:'/detail', name:'detail', components: detail, meta:{ ...
2020-04-22 12:00:07
95
原创 webpack 切换静态资源的图片不需要重新编译打包
场景对于已经打包上线的软件，需要切换不同公司的logo图片，这时就需要通过修改dist文件夹下的img图片即可分析vue打包的时候一般会携带一个静态资源的文件夹static，我们可以直接查看并修改里面静态资源、图片问题发现static-》img下的图片只有一部分，还有一些应用的没有显示解决vue-cli3打包的时候，对图片打包进行了优化，默认小于10KB的图片(比如pn...
2020-04-20 15:20:21
896
原创 SyntaxError: Unexpected token u in JSON at position 0 at JSON.parse (<anonymous>)报错原因
这是因为JSON.parse()解析的值是undefined了，即JSON.parse(undefined)在使用之前判断一下就可以了
2020-04-14 01:45:27
14947
1
原创 修改NutUI中TextInput 文本框的
先通过F12检查控制input框样式类再打开 node_modules ——》@nutui——》nutui.css文件，然后通过Ctrl+F搜索该css文件中是否存在上图中控制的类.nut-textinput然后在自己编写的网页中添加一个外框，并设置一个类名来指定对应要修改的样式，并结合scoped和>>>符号进行穿透，覆盖默认的样式。html:<...
2020-03-24 21:46:16
2036
1
原创 在Vscode使用GitHub开发工具管理代码
前提：已经安装好Git环境，配置好路径查看是否安装成功：git --version ，如果显示版本号则安装成功步骤：远程准备在GitHub或码云上创建一个新的远程仓库（以github为例）本地准备1. 在本地新建一个文件夹testgit（可自定义文件名），作为本地仓库2. 用vscode打开testgit文件夹，点击代码管理工具，初始化存储仓库，生成.g...
2020-03-20 15:23:22
737
原创 MongoDB中的多表关联查询（$lookup）
当一个前端菜鸡需要做一个全栈的毕设项目，真的是太不容易了，特别是我这种数据库还特别渣的人。新接触的mongodb，很多语法也还没了解透彻，对于所谓的集合嵌套或者集合引用真的是一窍不通，但是最后还是得实现啊，感谢这位大神的分享，这位大哥的详解真的是十分到位，我终于搞懂了https://www.cnblogs.com/xuliuzai/p/10055535.html我的实现过程前期需求：...
2020-03-08 00:53:11
1650
1
原创 在Vue中监听storage（全局封装使用）
应用点：个别的共享数据可以不使用vuex，直接使用storage来存储公共数据。重点：如何做到在保存数据的同时，可以在另一个路由中监听到数据的变化并且执行相应的操作。基本步骤：1. 封装全局监听方法：在main.js中给Vue.protorype注册全局方法。约定监听的sessionStorage的值为"watchStorage"，然后创建StorageEvent方法，当执行sessi...
2020-02-18 16:05:41
1079
原创 git拉取远程分支到本地 以及 提交代码到远程
git拉取远程分支到本地新建一个空文件，文件名可以自定义 初始化：git init 与远程分支建立连接：git remote add origin git@gitLab.com:xxxxx.git （打开gitlab仓库，在clone下复制的地址） 把分支拉取到本地：git fetch origin dev (dev 为远程仓库的分支名) 在本地创建分支dev并切换到该分支：git c...
2020-02-05 11:42:05
729
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人