- 博客(395)
- 收藏
- 关注
RSS订阅原创 CSS修改默认列表元素样式(1.修改默认元素样式 2.伪元素选择器)
CSS修改默认列表元素样式<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
2022-02-28 09:31:57
548
原创 解决微信小程序的video元素层级太高无法遮盖问题
解决微信小程序的video元素层级太高无法遮盖和show-play-btn属性失效问题今天在项目中遇到了这个问题，需要在微信小程序中用视频作为背景，微信开发者工具中模拟的没问题，真机调试就发现video的层级太高，其他元素设置 z-index 都低于 video微信官方文档提供的解决办法因为微信小程序的 video 原生组件层级太高，无法用 z-index 层叠。所以可以使用 <cover-view> <cover-image> 作为覆盖在原生组件之上的文本视图元素可覆盖
2022-01-16 18:16:59
3168
5
原创 vscode 自定义全局代码片段
vscode 自定义全局代码片段一、创建新的自定义用户代码片段文件 - 首选项 - 用户片段选择新代码片段命名文件二、写自定义代码片段JS{ // Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and // description. Add comma separated ids of the languages wher
2021-12-28 16:03:08
793
原创 flex布局演示(可线上运行项目)
flex布局演示（项目可线上运行项目）代码：<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale
2021-12-22 11:16:35
896
1
原创 JavaScript 常用Array、String方法
1、常用Array方法concat()连接两个数组[1, 3, 5, 7, 9].concat([2, 4, 6, 8, 10])forEach()遍历数组[1, 2, 3, 4, 5, 6, 7, 8].forEach(function(el, index) { console.log('arr[' + index + '] = ' + el + ' ' + this);})includes(value) ES7新增 判断是否包含该值['aa', 'bb', 'cc',
2021-12-13 10:00:05
731
原创 JavaScript中的try...catch...finally
JavaScript中的try…catch…finallytry 中无异常，执行finally (function fn() { try { console.log("无异常代码"); // throw new Error("有异常代码，抛出异常"); } catch (e) { console.log("有异常，则执行"); } finally { console.
2021-12-07 10:19:42
283
原创 vscode使用vuex数据持久化插件(vuex-persistedstate)
vscode使用vuex数据持久化插件(vuex-persistedstate)因为Vue是单页面应用，页面跳转是vue-router实现的类似页面跳转的效果（切换对应的组件以展示不同的页面），刷新页面会让整个页面数据回到初始状态，即：vuex.state中的数据还原到初始值一、刷新页面，vuex数据未持久化项目结构：store/index.jsimport Vue from "vue";import Vuex from "vuex";import state from './state.j
2021-12-06 18:00:39
800
原创 JavaScript十六进制、八进制、二进制与十进制互转
let a=17; let b = 10; let c=5; //十进制转十六进制 console.log(a.toString(16)); //十进制转八进制 console.log(b.toString(8)); //十进制转二进制 console.log(c.toString(2));
2021-11-22 17:48:48
611
原创 Git flow（使用工具自动git flow+解决合并冲突）
Git flow（使用工具自动git flow+解决合并冲突）1. Git Flow常用分支**生产分支（master）**Master分支只能从其他分支合并，不可直接修改，Master分支的Commit应该Tag**补丁分支（hotfix）**当我们在生产环境发现新的Bug时候，我们需要基于master分支创建一个Hotfix分支，然后在Hotfix分支上修复bug，完成Hotfix后，我们要把hotfix分支合并回Master和Develop分支**发布分支（release
2021-11-22 10:18:24
869
原创 JavaScript 4行代码找出重复出现次数最多的元素及次数
找出重复出现次数最多的元素及次数(高阶函数解法)今天遇到的一个面试题，看起来比较简单，解题却用几个循环嵌套，感觉不对劲，后面又想了一个比较优雅的解法，如下：解题思路为数组内每个元素生成一维数组元素数组长度最大的就是重复次数最多的元素，该数组长度就是重复次数代码 let arr = [1, 4, 2, 5, 7, 1, 4, 4, 3, 2, 0, 4, 3, 7, 7, 7, 7]; let arr2 = new Set(arr), list = [] arr2.fo
2021-11-19 22:13:42
626
原创 盒子模型（W3C盒子和IE盒子）
盒子模型（W3C盒子和IE盒子）盒子模型封装周围的 HTML 元素，包括:margin，border，padding和实际内容。两种盒子： border-box IE盒子模型 、content-box W3C盒子/标准盒子(默认样式)盒模型: 内容(content)、填充(padding)、边界(margin)、 边框(border)；区 别: IE的 width = border + padding + content（即：宽度固定，增加border或padding会向内挤压conte
2021-11-17 10:20:19
297
原创 事件循环中的宏任务和微任务执行顺序
事件循环中的宏任务和微任务执行顺序先来了解一下事件循环、宏任务、微任务和Promise1.事件循环（Event Loop）运行机制执行一个宏任务（栈中没有就从事件队列中获取）执行过程中如果遇到微任务，就将它添加到微任务的任务队列中宏任务执行完毕后，立即执行当前微任务队列中的所有微任务（依次执行）当前宏任务执行完毕，开始检查渲染，然后GUI线程接管渲染渲染完毕后，JS线程继续接管，开始下一个宏任务（从事件队列中获取）2.宏任务、微任务执行顺序： 先宏后微宏任务（发起者:宿主（Node、
2021-11-15 16:45:29
7803
3
原创 uni-app项目实现客服、用户聊天
uni-app项目实现客服与用户聊天的api在微信开放文档中已经明确指出了此接口：1.添加按钮<button type="primary" open-type="contact">开始聊天</button>2.真机调试3.点击聊天进入聊天窗口4.在小程序中添加自己为客服5.在微信中回复客户...
2021-11-15 14:52:09
3793
2
原创 创建一个uni-app项目并运行到微信开发者工具（真机调试）
创建一个uni-app项目并运行1. 下载HBuilderX、微信开发者工具HBuilderX官方下载链接: HBuilderX选择开发版，这样就不用再下载各种插件了微信开发者工具官方下载链接:微信开发者工具小程序选择稳定版2. 创建uni-app项目在点击工具栏里的文件 -> 新建 -> 项目：选择uni-app类型 -> 输入工程名 -> 选择模板 -> 创建：3.运行项目因为是一个使用 Vue.js 开发所有前端应用的框架，所以学过Vue.js
2021-11-15 14:34:38
3500
原创 父子/父孙传参（Provide/inject方式）
父组件export default { data() { return { info: 'AAA' } }, // 父组件提供info provide() { return { getInfo: this.getInfo, setInfo: this.setInfo } }, methods: { setInfo(val) { this.info = val; }, getInf
2021-11-09 17:40:48
813
原创 Moment.js在Vue中使用
Moment.js在Vue中使用1. 安装依赖包npm install moment --save 2. main.js中引入import moment from 'moment'Vue.prototype.$moment = moment3.组件中使用$moment(scope.row.add_time).format('YYYY-MM-DD HH:mm:ss')
2021-11-05 19:28:21
286
原创 npm报错，安装不上依赖，npm代理报错
npm报错：npm ERR! code ECONNREFUSED npm ERR! errno ECONNREFUSED，npm ERR! npm ERR! If you are behind a proxy, please make sure that the在仓库上拉下来项目，安装依赖时报错：问题出现原因：Github相当于程序员的百度，但是速度有时又太慢，就使用了某VPN代理访问。结果，VPN给我开了一个端口，npm的一些依赖包访问速度巨慢，就出现了上图报错解决方法1. 查看代理npm
2021-11-03 18:28:44
3303
原创 jQuery获取/设置css样式，获取/设置标签属性，排他选择器
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> span { color: pink; } .btn2 p { display: none; } .btn2 .active { display: block; } </style>
2021-10-28 12:10:27
412
原创 css属性百分比与px相加减
css百分比与px相加减使用calc来对width设置:width: calc(100% - 100px);<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> p { width: 100%; background-color: palegreen;
2021-10-27 12:31:19
1343
原创 三次握手，四次挥手（大白话）
三次握手，四次挥手三次握手确认对端没问题第一次握手：客户端发送网络包，服务端收到了。服务端得出结论：客户端的发送能力、服务端的接收能力是正常的。第二次握手：服务端发包，客户端收到了。客户端得出结论：服务端的接收、发送能力，客户端的接收、发送能力是正常的。第三次握手：客户端发包，服务端收到了。服务端得出结论：客户端的接收、发送能力，服务端的发送、接收能力是正常的。四次挥手关闭双工第一次挥手：客户端 – FIN --> 服务端， FIN—WAIT（客户端：我数据发完了，可
2021-10-27 12:12:02
1216
原创 Git分支推送
Git分支推送1. 仓库状态如下图，目前仓库只有一个master主分支2. 创建两个分支创建张三、李四两个分支3. 切换到zs分支更新文件后推送切换zs分支当这个小圆圈在zs分支上就切换成功更新文件同步4. zs分支推送成功5. 主分支不影响切换到master分支，没有影响...
2021-10-27 11:32:59
579
原创 仙剑奇侠传7报错：the following components are required to run this program.microsoft visual c++ 2015 runtime
仙剑奇侠传7报错：the following components are required to run this program.microsoft visual c++ 2015 runtime1. 找到Steam的环境安装包报错了不要急，在自己的Steam的目录下会有游戏支持环境安装包，不用自己下载，目录如下：2. 执行安装包64位系统安装：VC_redist.x64.exe32位系统安装：VC_redist.x86.exe3. 安装成功后，再开始游戏...
2021-10-23 23:21:27
33644
原创 生成n位随机汉字
获取n位随机汉字（Javascript）1. 使用Unicode编码:中日韩统一表意文字字符中日韩统一表意文字（英语：CJK Unified Ideographs），也称统一汉字（英语：Unihan），目的是要把分别来自中文、日文、韩文、越南文、壮文中，起源相同、本义相同、形状一样或稍异的表意文字，赋予其在UISO 10646及万国码标准中相同编码。此计划原本只包含中文、日文及韩文中所使用的汉字，旧称中日韩（CJK）统一表意文字（Unified Ideographs）。后来，此计划加入了越南文的喃字，
2021-10-23 13:32:30
482
原创 Vue父组件访问子组件属性和方法、父子组件双向绑定（两种方法）
Vue父组件访问子组件属性和方法、父子组件双向绑定（二种方法）1. 使用vue-cli创建项目目录结构如下图:2. 编写代码src/components/HelloWorld.vue<template> <div class="hello"> <h3>{{ msg }}</h3> 子组件绑定了vue的属性:<input type="text" v-model="text"> <br /> 使用子传
2021-10-23 10:47:14
764
原创 vscode使用Git Graph提交成功，但是仓库没有更新
在vscode中使用Git Graph插件提交修改成功，但是在仓库中并没有更新问题出现原因更改了拉下来的git文件夹的位置。原来在 E:// Gitee仓库/myWorkspace 下克隆的仓库现在将其移动到 F:// Gitee仓库/myWorkspace 下，就会出现这种情况。解决方法将其移动到原来的位置，或者在新位置克隆一下仓库，再到vscode使用git graph提交一次就ok...
2021-10-22 10:09:45
1795
原创 解决Vue-Router报错：vue-router.esm.js:17 [vue-router] ＜router-link＞‘s tag prop is deprecated and has been
在中使用了tag属性就报错：[vue-router] 's tag prop is deprecated and has been removed in Vue Router 4. Use the v-slot API to remove this warning: https://next.router.vuejs.org/guide/migration/#removal-of-event-and-tag-props-in-router-link.<router-link tag="spa
2021-10-21 17:10:10
5059
原创 已解决：fastclick插件在IOS系统上点击input需要双击或长按才有效
已解决：fastclick插件在Vue移动端IOS系统上点击input需要双击或长按才有效做Vue项目的登录注册页面测试时发现的问题，Chrome浏览器上使用三星手机Glaxy S5测试input是没有问题的，换成了iPhone 6/7/8 Plus就出现了input需要双击或长按才有效的问题尝试了好久，虽然使用touchstart也可以达到效果，但还是感觉不对劲，就去看了一下fastclick作者的github文档中有没有解决方案滑到下面，居然让我找到了点击失焦的栗子 hhhhhh不过在找
2021-10-21 12:11:14
1003
原创 css设置子盒子水平垂直居中（四种方式）
css设置子盒子水平垂直居中（四种方式）1. 使用绝对定位<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> * { margin: 0; padding: 0; } div { position: relative; width: 200px;
2021-10-20 19:49:31
258
原创 vue计算属性与监听器的区别
vue计算属性与监听器的区别计算属性（computed）监听器（watch）监听data中没有的值监听data中有的值使用时触发使用不会触发值有变化就触发值有变化就触发没有settter，要手动实现可以获取 新的 和 旧的值会缓存计算结果， 重新使用不会触发该方法计算属性 eg:<!DOCTYPE html><html> <head> <meta charset="utf-8"> &l
2021-10-20 11:34:34
756
原创 Vue终端取消vue、prettier警告warn
使用vue-cli创建时，选择了linter/formatter检查代码格式就会有警告和报错如下，警告：代码中的换行不符合规范，要删除。我裂开如果在这堆warn中有一个error，还要找好久。在.eslintrc.js这个隐藏文件中可以设置开发和生产模式是否在控制台显示警告代码。取消警告方法：rules: { // 原始设置：在开发模式中显示警告 // "no-console": process.env.NODE_ENV === "production" ? "w.
2021-10-18 12:04:58
5368
2
原创 Vant报错：[Vue warn]: Invalid prop: type check failed for prop “lazyLoad“. Expected Boolean, got String
使用vant懒加载设置lazy-load后报错信息：这里很奇怪，对比官方文档看了下，是设置true没错啊，为什么怎么改都报错解决：绑定此属性就好了
2021-10-16 17:47:33
516
原创 Vue使用v-for绑定两个属性拼接渲染界面
现在从数据库取回的数据中，要渲染的image的src是imageHost+mainImage：拼接方式：:thumb=“item.imageHost+’’+item.mainImage”<!-- 商品列表 --> <section class="product-list"> <div class="product-container"> <van-card v-for="(item,index) in products
2021-10-16 17:10:16
689
1
原创 Vscode 设置html标签不要自动换行
Vscode 设置html标签不要自动换行1、安装两个格式化插件（vetur、prettier）二、找到vueter的配置格式的json文件三、添加代码防止html标签自动换行// 禁止html标签自动换行 "vetur.format.defaultFormatter.html": "js-beautify-html", "vetur.format.defaultFormatter.js": "vscode-typescript", "vetur.format.defa
2021-10-15 12:13:08
2727
原创 Vue 使用 rem布局
Vue 使用 rem布局1、rem布局需要安装两个插件npm i lib-flexible -Snpm i postcss-pxtorem -Dlib-flexible: 根据移动端屏幕大小而对应改变html的fontSizepostcss-pxtorem： 根据html的fontSize将px单位改变为rem单位有了以上两个插件，就可以直接在css中写px单位，项目在渲染时会自动帮我们把写的px单位转换为rem单位。这里用的是750px的设计稿。2、项目中创建postcss.con
2021-10-14 18:12:27
1486
原创 Vue+Vue Router+Vuex页面演示
Vue+Vue Router+Vuex简单页面演示1、目录结构（使用vue-cli创建）2、编写代码src/router/index.jsimport Vue from "vue";import VueRouter from "vue-router";import Home from "../views/Home.vue";Vue.use(VueRouter);const routes = [ { path: '/', name: 'Login', comp
2021-10-14 14:46:49
268
原创 Git三种报错:E325: ATTENTION、Please enter the commit message for your changes、Timed out
三种报错解决:1、报错:E325: ATTENTION:删除.git隐藏文件夹下的.COMMIT_EDITMSG.swp2、报错:Please enter the commit message for your changes. Lines starting # with ‘#’ will be ignored使用git push -u origin master提交3、报错:Timed out因为刚刚使用VPN访问Github，克隆http地址之后就马上git clone 仓库了，但是
2021-10-13 18:45:25
761
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人