![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Web前端
文章平均质量分 51
前端常见问题技术blog
惊悚的毛毛虫
这个作者很懒,什么都没留下…
展开
-
微信小程序 IOS 黏性布局sticky包裹scrollview使用页面异常问题
问题描述:使用 sticky 包裹横向的scrollview使用时在到达页面底部时因ios橡皮筋还会继续向下拉伸,在拉伸到一定高度时在顶部的横向scrollview会消失,更高时整个sticky元素都会消失。解决方法:页面最外层再包裹一层高度100vh的scrollview即可解决该问题。原创 2023-03-06 14:53:35 · 855 阅读 · 0 评论 -
跨域cookie (domain )
其他产品在启动时候首先进行判断cookie中token是否存在,如存在则可以直接使用。通过产品1与产品2任意登录,另外一个都不需要登录。在任意产品登录完成时存储token至cookie中。a.baidu.com 产品1域名。b.baidu.com 产品2域名。baidu.com 一级域名。原创 2022-10-12 16:20:53 · 361 阅读 · 0 评论 -
雪碧图 css 使用方式与 Js使用方式
示例雪碧图如下,雪碧图图片资源来源于力扣官网中头像悬浮Dark Side功能。原创 2022-08-12 16:27:32 · 956 阅读 · 1 评论 -
Uniapp Android原生插件开发
准备工作:Android Studio 下载地址:Android Studio官网ORAndroid Studio中文社区 离线SDK下载:请下载2.9.8+版本的android平台SDK1. 使用Andorid Studio 打开UniPlugin-Hello-AS原创 2022-04-01 17:03:19 · 15879 阅读 · 12 评论 -
CSS 去除文本上下多余间距
直接使用如下设置即可, 参考自链接,Fractal回答。单行文本line-height:1;多行文本line-height:1.5;margin:-0.25em 0;em单位解释:相对于元素的字体大小(font-size)(2em 表示当前字体大小的 2 倍)...原创 2021-09-26 14:08:40 · 2422 阅读 · 0 评论 -
Uniapp 微信小程序直接打开地图App (不经过内置地图页)
效果图原创 2021-06-02 16:43:38 · 5103 阅读 · 6 评论 -
Nodejs 代码方式操作git
gitTools.js 工具函数const { spawn} = require('child_process');module.exports = class gitTools { /** * 构造函数 * @param {String} gitDirectory 本地git目录 * */ constructor(gitDirectory) { this.gitDirectory = gitDirectory; } /** * git add * */.原创 2021-05-27 11:27:06 · 3096 阅读 · 0 评论 -
Ant design Of Vue vue-amap 高德地图选点组件
参考链接:Vue(vue-amap) 接入高德地图获取坐标与地址信息 ‘AMapUI‘ is not definedtips: 请参照以上链接配置完成后使用以下组件代码效果图:1. 初始样式2. 地图选点样式3. 搜索样式4. 选点后样式5. 选点后样式组件代码<template> <div> <div class="selector-box"> <div> .原创 2021-05-22 09:41:54 · 2781 阅读 · 7 评论 -
JavaScript 获取某个时间的当周的任意一天
/** * 获取任意时间的任意一天 * date : {Date} 某个时间 * day : {Number} 要获取的周几 ( 1 - 7 ) * */ getWeekEveryDay(date, day) { if (!date) return date; try { let temp = new Date(date); let targetDay = day == 0 ? 7 : day; let curDay ...原创 2021-04-19 14:00:58 · 146 阅读 · 0 评论 -
html app下载页功能开发
var androidHref = '' // 安卓下载地址 var iphoneHref = '' // iOS下载地址 $('.download-button-list .ios').on('click', function() { /...原创 2021-03-09 16:07:11 · 2971 阅读 · 0 评论 -
vue 使用tracking.js开发人脸识别功能
开发思路: 前端只负责检测摄像头内是否存在人脸,如果存在人脸截图当前帧调用接口后台进行人脸对比校验,通过接口返回来确认是否识别成功。前端使用人脸识别类库trackingjs可以直接在github上直接下载,npm安装感觉有问题。github下载地址。下载完毕以后放入到 src/assets 目录下文件夹更名为 tracking 方便引入HTML 示例代码<template> <div> <div class="video-box">...原创 2021-02-28 11:12:05 · 7578 阅读 · 20 评论 -
JavaScript 浅拷贝与深拷贝
浅拷贝// 浅拷贝// 定义cat01名称为小黑var cat01 = { name:'小黑',logName:function(){console.log(this.name)} }// 定义cat02拷贝cat01var cat02 = cat01;// 修改cat02的名称为 小花 本次赋值也将修改cat01的name为 小花// 因定义变量直接等于一个对象时其实只是指向内存地址cat02.name = '小花';cat01.logName(); // 打印小花cat02.lo原创 2020-07-30 16:40:33 · 196 阅读 · 1 评论 -
JavaScript Object.defineProperty()理解与示例
以下为示例代码,可根据注释理解代码,详细步骤以后再写.参考链接:https://www.jianshu.com/p/ce4fbd2c0e23configurable / enumerable / writable 解释与示例// 声明一个空对象var person = {};// ? Object.defineProperty// 1. Object.defineProperty(已声明对象,自定义变量名称,设置参数信息)// 2. 该方法会在person中声明或修改变量//...原创 2020-07-30 15:22:11 · 204 阅读 · 0 评论 -
JavaScript 原型与原型链
关于以下使用的call方法参考链接:https://www.runoob.com/w3cnote/js-call-apply-bind.html结合以下注释理解代码,有空再分步骤讲解// 给Cat定义一个共有方法 logName(解释看下面ColorCat.prototype.logInfo)Cat.prototype.logName = function(){ console.log(`名称:${this.name},年龄:${this.age}`);}// 声明一个构...原创 2020-07-29 19:26:44 · 121 阅读 · 0 评论 -
JavaScript 箭头函数与function函数区别
// 执行正常 function 方法名() 会直接将函数提升到顶部所以此步成功normalFun(2);// 执行失败 因var会将arrowFun变量提升但赋值仍在原本行无法在赋值前调用// arrowfun();// 箭头函数var arrowFun = ()=>{console.log(this)}// 正常函数function normalFun(a){this.a = a; console.log(this)}// 定义对象cat有两个属性分别保存箭头函数和正常函数所定义.原创 2020-07-30 11:01:44 · 647 阅读 · 0 评论 -
JavaScript 闭包的简单理解与示例
闭包简单理解:需要重复循环使用一些变量但该变量又不想让其他方式污染(私有变量)闭包的声明: 声明一个函数包裹变量并return返回一个内部函数或返回对象中包含多个函数方法闭包的调用:声明一个变量初始化赋值函数后即可反复调用(多次声明不相互影响)返回一个内部函数方法示例:// 声明闭包 Catfunction Cat(){ var age = 0 return function(){ return ++age; }}/...原创 2020-07-28 17:24:30 · 147 阅读 · 0 评论 -
JavaScript class 声明与使用
class简单声明以下声明了一个简单类 Catconstructor 为构造函数(该类若需要被继承则必须声明构造函数否则可忽略)// 声明class Cat { constructor() { console.log('constructor') }}// new一个对象var cat = new Cat();使用 constructor 构造函数传递参数并调用参数// 声明class Cat { constructor(name) { t...原创 2020-07-27 11:46:48 · 712 阅读 · 0 评论 -
微信小程序 简单理解与基本操作
只能在App.js中使用App()来进行微信实例创建,页面则使用Page().其他页面则可以使用getApp()来获取App实例,App内则不允许这样操作,可使用this来代替原创 2020-06-24 16:07:10 · 495 阅读 · 0 评论 -
Vue Transition 挤压其他元素问题
错误示例代码:<transition name="custom"> <h1 class="title" v-if="value==1" >标题</h1></transition><div id="t1">测试文字</div>以上执行效果会为在动画未执行时t1会在最上方,在动画执行时 t1 会被动画挤压到下方.解决方案:<div class="box"> <transition na..原创 2020-06-08 09:39:48 · 653 阅读 · 0 评论 -
Vue this.$emit 子组件向父组件传递
子组件向父组件传递数值在父组件进行调用子组件需要使用 v-model 进行绑定接收数据的变量,示例代码如下理解为自定义组件命名为 swiper 绑定父组件在data里面声明命名为 currIndex 变量<swiper v-model="currIndex"></swiper>子组件若想修改 currIndex 变量内容需要使用 this.$emit('index',数值内容) 示例代码如下理解为修改currIndex 为数值 1 this.$emit(.原创 2020-06-05 11:12:56 · 355 阅读 · 0 评论 -
HTML 在手机端查看控制台日志 vconsole
首先引入js (js文件可以直接去github上下载 https://github.com/Tencent/vConsole) <!-- 引入vConsole的JS库 --> <script src="js/dist/vconsole.min.js"></script>初始化vconsole代码<script> //...原创 2019-12-16 11:47:01 · 5386 阅读 · 0 评论 -
禁止在微信浏览器上下滑动及缩小放大
1. 设置头 <meta charset="utf-8" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />2.css <style> html, body { ...原创 2019-12-16 11:47:44 · 594 阅读 · 0 评论 -
微信浏览器去除底部导航栏
跳转方式使用:window.location.replace('url');这样微信浏览器就不会存有历史记录,有效隐藏底部出现后退栏的白条!参考链接:https://segmentfault.com/q/1010000015158396评论人: 古月石石石...原创 2019-12-16 11:48:13 · 6217 阅读 · 0 评论 -
HTML Rem自适应方案
1. 设置标签头 <meta charset="utf-8" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />2. 设置body html 全屏 <style> html,...原创 2019-12-16 11:48:36 · 15316 阅读 · 4 评论 -
threejs 加载天空盒在手机浏览器导致页面重新加载问题
/* load sky box helper* path : path* array: file name array* callback: load over return function* */var loadSkyBoxLoader = new THREE.CubeTextureLoader();function loadSkyB...原创 2019-12-16 11:47:16 · 1838 阅读 · 3 评论 -
HTML JS 实现360序列帧播放及放大缩小功能 easyTouchGIF
效果:实现了序列帧图片滑动播放可用于360展示车或3维模型等, 实现了放大可以放大缩小功能。easyTouchGIF工程链接:链接:https://pan.baidu.com/s/1KRsOpU7KozsuVgyGTmwq9Q提取码:zxw8...原创 2019-12-16 11:48:06 · 497 阅读 · 0 评论 -
Three.js 射线检测异常问题
Bug描述:创建了很多热点有的在初始摄像机视野内有的不在,点击的时候射线检测代码将不在视野范围内的热点也视为检测到。解决方案(我是使用的其他方法解决,如果你知道更好的解决方案在下面评论):在点击的时候过滤不在视野范围内的对象只检测在视野范围内的对象。检测对象是否在视野范围内参考链接:https://blog.csdn.net/u014452812/article/detail...原创 2019-12-16 11:48:37 · 1144 阅读 · 0 评论 -
使用Vue-cli构建项目
1. 使用淘宝镜像全局安装 cnpmnpm install cnpm -g --registry=https://registry.npm.taobao.org2. 全局安装Vue-clicnpm install vue-cli -g3. 检查是否成功安装 Vue,若提示vue版本则表示安装成功vue --version4. 构建项目 首先使用cd进入e盘,使用vue构建命令名为my-test-vue的项目文件cd E:\vue init webpack ...原创 2020-06-03 18:21:40 · 221 阅读 · 0 评论 -
JavaScript 序列化时间
首先对Date的format进行函数重载,代码如下!Date.prototype.format = function(fmt){ let o = { "M+": this.getMonth() + 1, //月份 "d+": this.getDate(), //日 "h+": this.getHou..原创 2020-05-29 16:10:35 · 359 阅读 · 0 评论 -
Vue2.x 理解与基本操作
1. 单向绑定 'v-bind'理解为HTML代码里面绑定在Vue中声明的变量,当变量发生变化时页面上数据也将发生改变,代码示例如下Html第二行没有使用 'v-bind' 关键字 但与第一行效果等同是因为Vue提供了 ':' 的语法糖效果等同与 'v-bind'Css.color-gray{ color:gray;}.size-18{ font-size: 18px;}.style-italic{ font-style: italic;}Html<!-- ..原创 2020-06-01 11:40:32 · 458 阅读 · 0 评论