- 博客(43)
- 收藏
- 关注
RSS订阅转载 react加锚点
实现锚点滚动，不要使用<a>标签，会引发路由跳转。我们使用H5的新增API，scrollToAnchor以前使用<a>标签的方法<button onClick={() => this.scrollToAnchor(name)}></button> //定义锚点<div id='activity1'></div> //跳转到的锚点//函数定义scrollToAnchor = (anchorName)
2022-03-09 14:09:53
1806
1
转载 react hooks方法获取不到最新的state解决方法
问题在setState方法执行之后，再执行自定义的方法，这个自定义方法里面获取不到最新的state状态import React, {useState} from "react";import { Button } from "antd"const Demo = () => { const [num, changeNum] = useState(1) const [str, changeStr] = useState("现在数字是1") const getN
2022-03-09 14:00:11
2749
翻译 判断js对象中是否存在某个方法或者属性（以window为例）
1.验证方法 以WebSocket为例if (window.WebSocket) { console.log('WebSocket');}if (typeof(window.WebSocket) === 'function') { console.log('WebSocket');}if (window.WebSocket instanceof Function) { console.log('WebSocket');}window.hasOwnProp
2022-02-25 13:58:27
3211
原创 Git 合并时 子模块submodule 冲突问题解决方法
假如当前在 branchA，在执行 git merge branchB 时，可能会遇到子仓库文件冲突可以尝试一下命令：git update-index --cacheinfo 0160000, <commit-hash>, "<子仓库path>"//例子git update-index --cacheinfo 0160000,533da4ea00703f4ad6d5518e1ce81d20261c40c0,module-common 其中<commit.
2022-02-15 19:13:03
5982
转载 Vue：滚动页面到指定位置实现
在Vue中，有三种方式可以实现H5页面滑动至指定位置方法1：//先获取目标位置距离mounted() { this.$nextTick(() => { setTimeout(() => { let targetbox= document.getElementById('targetbox'); this.target= targetbox.offsetTop; }) })}//再滑动指定距离document
2022-01-29 11:18:55
15881
3
转载 vue组件中this和$el指向
示例代码为element ui 源码的select组件源码控制台输出：结论：this指向组件的实例。$el指向当前组件的DOM元素。
2022-01-25 10:48:15
372
转载 Element-UI 框架 el-scrollbar 组件
快速使用<el-scrollbar> <li v-for="user in userList" :key="user.id">{{user.name}}</li></el-scrollbar>具体实例<el-scrollbar wrapClass="yf-container" viewClass="yf-content" wrapStyle="color:'#fff';fontSize:'16px'
2021-12-11 18:51:46
308
原创 打开大写锁定的方法
onKeyPress(event: any) { this.platform = getDevice(); if((event.shiftKey && this.platform === "mac" ) ||event.getModifierState('CapsLock')){ this.isCapsLock = true; }else{ this.isCapsLock = false; } //event.g.
2021-12-02 10:56:06
445
转载 CSS 实现多行文本“展开收起”
要想实现如下效果：实现这一类布局和交互难点主要有以下几点位于多行文本右下角的“展开收起”按钮 “展开”和“收起”两种状态的切换 当文本不超过指定行数时，不显示“展开收起”按钮说实话，之前单独看这个布局，即使借助 JavaScript 也不是一件容易的事啊（需要计算文字宽度动态截取文本，vue-clamp就是这么做的），更别说下面的交互和判断逻辑了，不过经过我的一番琢磨，其实纯 CSS 也能完美实现的，下面就一步一步来看看如何实现吧~一、位于右下角的“展开收起”按钮很多设计同学.
2021-10-29 11:19:40
693
转载 element-ui Drawer 内容全部屏幕高度不能滑动
解决办法：/1.显示滚动条：当内容超出容器的时候，可以拖动：/.el-drawer__body{ overflow: auto; }/2.隐藏滚动条，太丑了/.el-drawer__container ::-webkit-scrollbar{ display: none; }作者：昨夜剑客链接：https://juejin.cn/post/6992807144949039111来源：稀土掘金著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。...
2021-10-29 10:25:38
1122
转载 VUE iframe实现加载（Loading）效果
<template> <div style="height:1000px;" v-loading="loading"> <iframe ref="Iframe" src="https://www.taobao.com/" width="100%" height="100%" frameborder="0"> </iframe> </div></t.
2021-09-28 11:39:52
3164
原创 h5背景图片不变形解决方案
昨天测试提了bug：说我的背景图片在不同手机模式下出现变形的情况，要求保证图片的原始效果我的写法：.img{ background-image:url(''); background-siza: 100% 100%;}由于盒子的高度是内容撑起来的，所有随着宽度的变化是保持不变的，况且图片的宽高比例是固定的，也没有好的方法去实时计算高度，所以这时候用cover，contain就达不到预想的效果，在我的不懈百度下，找到了一个特别容易的方式，只需添加一行代码即可搞定；..
2021-09-17 14:38:59
1630
转载 JavaScript文档注释JSDoc注释
普通多行注释/*** 普通的多行注释*/使用JsDocJSDoc 是一个根据 JavaScript 文件中注释信息，生成 JavaScript 应用程序或模块的API文档的工具。你可以使用 JSDoc 标记如：命名空间，类，方法，方法参数等。从而使开发者能够轻易地阅读代码，掌握代码定义的类和其属性和方法，从而降低维护成本，和提高开发效率。它必须以/ **开始，以便由JSDoc解析器识别。其他任何以 /* ， /*** 或者超过3个星号的注释，都将被JSDoc解析器忽略。@p
2021-09-14 11:30:40
4879
2
转载 Vue项目中$t()的意思
一般项目vue文件中将会把中文字符的数量拉至最低，这时候需要用一个文件容器来储存他们。举例：<el-form-item:label="$t('staffManage.modal.userName')"prop="userName"class="is-required"> <el-input v-model="formValue.userName" :placeholder="$t('staffManage.modal.placeholder')" /&.
2021-09-03 13:22:15
9986
1
原创 前端项目设置点击手机号码唤起拨号功能
1.index.html中添加如下代码：<meta name="format-detection" content="telephone=yes" />2.在需要调起手机拨号功能的页面，写如下函数：// 调用拨号功能callPhone (phoneNumber) { window.location.href = 'tel://' + phoneNumber}...
2021-09-03 13:14:30
1573
转载 H5页面跳转至应用市场（Android/ios)（判断是Android还是ios）
var u = navigator.userAgent; var isAndroid = u.indexOf("Android") > -1 || u.indexOf("Linux") > -1; //android终端 var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 //android端 if (isAndroid) { l...
2021-09-03 13:08:23
909
转载 vue devServer之proxy跨域
概念什么是同源策略同源策略是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。所谓同源是指：协议、域名、端口都相同什么是跨域跨域就是不同源，就是不满足协议、域名、端口都相同的约定如：看下面的链接是否与 http://www.test.com/index.html 同源？http://www.test.com/dir/login.html 同源https://
2021-09-03 09:41:43
845
转载 403？也许不只是前端问题
403？也许不只是前端问题跟运维联调过程中，运维同学告诉我，请求服务时，接口判断源地址，本来是服务器，没有问题；但是你本地起了一个 proxy，所以就判断你本地 proxy 地址了原理上根据 request_header 的 remote_addr 判断的http请求头中的 remote-addr, x-forward-for, x-real-ipremote-addr表示发出请求的远程主机的ip地址，remote-addr代表客户端的ip，但它的值不是由客户端提供，而是服务端根据客户端
2021-08-31 15:00:10
4365
转载 idea官网打不开的原因
1.之前安装过idea并且在使用过程中修改了hots文件解决:a.进入Win或mac系统的hosts文件所在位置,一般都是这个地址:C:\Windows\System32\Drivers\etc(ps:如果你打开了后缀名显示,就去打开没有后缀名的文件b.注释0.0.0.0 account.jebrains.com和0.0.0.0 www.jetbrains.com(ps:注释就是前面打#号 或者你直接删除也是可以的2.dns的问题解决:a.修改dns,114.114.114.114或者8.
2020-12-23 11:45:09
1731
原创 vue 日期格式化-将时间2020-11-10T12:01:50.942转换成2020-11-10 12:01
返回数据：页面效果：代码如下：dateFormat ('Tue Mar 06 2012 00:00:00 GMT+0800', 'yyyy-MM-dd');//示例function dateFormat (time, format) { var t = new Date(time) var tf = function (i) { return (i < 10 ? '0' : '') + i } return format.replace(/yyyy|M.
2020-11-17 09:43:27
3526
1
原创 Cannot read property ‘resetFields‘ of undefined
可以发现，只要显示过一次dialog，后面就不会报错了。所以我可以确定是因为代码量过大，对应的对象来不及生成，从而导致了读取了空对象。解决办法：resetForm(formName){ if (this.$refs[formName]!==undefined) { this.$refs[formName].resetFields(); }}...
2020-11-16 11:28:36
155
原创 封装JS判断各种浏览器内核
function(){ var u = navigator.userAgent, app = navigator.appVersion; return { trident: u.indexOf('Trident') > -1, //IE内核 presto: u.indexOf('Presto') > -1, //opera内核 webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核 .
2020-11-06 11:36:37
240
原创 Uncaught SyntaxError: Unexpected token u in JSON at position 0
这是因为某个地方用了JSON.parse，但是传入的参数不是一个合格的json字符串，也就是说后台可能返回了空或者undefined。解决：搜索一下parse，解析前先判断一下parse里即将传入的内容
2020-11-06 11:02:42
1051
原创 vue 事件修饰符（阻止默认行为和事件冒泡）
<!-- 停止冒泡 --><button @click.stop="doThis"></button><!-- 阻止默认行为 --><button @click.prevent="doThis"></button><!-- 阻止默认行为，没有表达式 --><form @submit.prevent></form><!-- 串联修饰符 --><button @clic.
2020-11-06 10:53:47
2747
转载 JS 之 阻止事件冒泡，阻止默认事件，event.stopPropagation()和event.preventDefault()，return false的区别
在前端开发中，有时我们需要阻止冒泡和阻止默认事件的发生。 一、event.stopPropagation() 阻止事件的冒泡，不让事件向documen上蔓延，但是默认事件任然会执行，当调用这个方法的时候，如果点击一个连接，这个连接仍然会被打开。 二、event.preventDefault() 阻止默认事件的方法，调用此方法时，连接不会被打开，但是会发生冒泡，冒泡会传递到上一层的父元素； 三、return false； 这个方法比较暴力，会同时阻止事件冒泡也会阻止默认事件；写上此代码
2020-11-06 10:33:24
381
转载 看懂cookie,及与localStorage与sessionStorage的区别
前言：cookie本身并不是用来做服务器存储的。但在 localStorage 出现之前，cookie被滥用当做了存储工具，什么数据都放在cookie中，即使这些数据只在页面中使用、而不需要随请求传送到服务端（当然cookie也做了一些限制：大小受限、每个域名下生成的cookie数量受限）。就像CSS中的float，最初被设计出来的初衷，是用于做文字环绕效果的，就是一个图片、一段文字，给图片加上float:left的样式后，就会产生文字环绕图片的效果。但是后来发现float结合，可以实现之前通过实现的网
2020-11-06 10:22:27
448
转载 前端对cookie的使用
注意：要使用cookie，页面必须在服务器中运行，直接双击打开页面无法使用cookie。 在进行微信公众号页面开发时，由于localStorage退出微信无法自动清除数据，而sessionStorage每次关闭页面就会清除数据。 既想要退出微信可以清除数据，而关闭页面又仍有留有登录信息时，我们可以选择把token存储在cookie中。cookie相关代码如下所示：//设置自定义过期时间cookiefunction setCookie(name...
2020-11-04 11:45:52
516
转载 jdk安装链接
https://jingyan.baidu.com/article/f96699bb163475894e3c1be4.html
2020-11-03 09:50:11
167
原创 对象
对象一、对象：1.实例化对象的方式：new Object()var obj = { name:”张三”}读取对象上的属性：obj.name||obj[“name”] 动态的给对象添加属性obj.age||obj[“age”] = 值 删除对象的属性：【关键字delete】 delete obj.name注意：对象的属性也是一个对象...
2019-08-15 17:37:52
106
原创 字符串对象
字符串对象1.var str = “abcd”; var str1 = new String(“abcd”); console.log(str == str1, str === str1); true false console.log(str,includes(“ac”)); f...
2019-08-15 14:40:09
271
原创 BOM(window)
BOM(window)1..Location(包含有关当前URL的信息) 【对象属性】.hash 设置或返回从#开始的URL（锚）；.href 设置或返回完整的URL（可读写）.search 设置或返回从？开始的URL（查询部分）2..History 对History对象的只读引用（length: back(): forward(): go()）...
2019-08-15 12:04:16
119
原创 事件
事件1.定义：事件是js跳动的心脏，可实现用户和浏览器之间的交互2.事件流：【事件执行的顺序】 1>事件捕获（默认被禁止）：从最不具体的元素到最具体的元素（从外到内）。2>事件冒泡（主流浏览器都支持）：从最具体的元素向最不具体的元素冒泡（从内到外【找父辈元素不找兄弟元素】。3.目标元素：是触发该事件的元素4.阻止事件冒泡： IE: 事...
2019-08-15 11:50:28
90
原创 DOM元素节点对象上的属性
DOM元素节点对象上的属性attributes 标签内部所有属性的集合childElementCount 父元素下所有子元素的数量childNodes 父元素下所有子节点的集合children 父元素下所有子元素的集合classList 当前元素...
2019-08-15 10:24:09
328
原创 DOM
DOM1.文档对象模型2.DOM描绘了一个层次化的节点树3.节点类型：每一个节点上都有nodeName, nodeType, nodeValue，每一种节点都是对象 1> 文档节点 2> 注释节点 3> 属性节点 4> 文本节点 5> 元素节点4.获取元素节点对象的操作方法...
2019-08-14 20:28:25
98
原创 函数
函数1.定义：函数是由事件驱动的当被调用执行时可以重复使用的代码块。2.函数可以在任何时候任何地方封装，也可以在任何时候任何地方被调用执行（针对命名函数，因为匿名函数赋值给的变量存在声明提升）3.函数里的隐藏对象：arguments。arguments是一伪数组，是对象，是所有实参的一个集合eg: function fn(a,,b,c,d,e){ console.lo...
2019-08-14 15:57:10
104
原创 数组
数组1.数组也是对象的一种2.数组的创建方式： 1）字面量（直接量） Eg：var arr = [1,2,3,4,5]; 注意：a)数组中的元素是可读写的； b)arr[6.6]=8 中括号中的6.6表示属性名，8表示属性值 ...
2019-08-14 15:47:16
175
原创 日期时间对象
日期时间对象1.定义：用来保存日期时间的，以特定的时间段保存时间，从1970年向前和向后推285616年。UTC是格林尼治时间，又称为世界统一时间，2.日期时间对象：Date3.实例化日期时间对象 var data = new Date() 表示当前本地时间var s = new Date()*1 == date.valueOf(); 表示特定时间戳，从19...
2019-08-14 10:13:31
222
原创 正则表达式
正则表达式1.正则对应的构造函数：RegExp；2.创建正则表达式： 直接量：/ /; New关键字：new RegExp(“正则”,“修饰符[11]”)；3.汉字：/[\u4e00-\u9fa5]/g4.正则中引入变量的方式； Eg: var char = ...
2019-08-14 08:46:40
461
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人