- 博客(39)
- 收藏
- 关注
RSS订阅原创 手机端遇到的问题记录
1、使元素滚动到当前视口顶部：定义ref: private refScroll: { current: HTMLDivElement | null } = React.createRef();this.refScroll.current.scrollIntoView({behavior: ‘smooth’,});2、iphoneX 安全区问题1） 设置网页在可视窗口的布局方式新增...
2019-12-22 23:43:05
339
原创 使用create-react-app + antd快速搭建项目框架
1、搭建本地开发环境npx create-react-app my-appcd my-appyarn start2、安装antdantd使用的less，故如需修改其样式，需在项目中进行less的相关配置yarn eject //暴露配置文件--仅可使用一次，之后项目文件夹会多出来config文件夹 // react脚手架2.x 中将webpack.config.dev...
2019-12-15 18:51:50
637
原创 vuerouter带参数为数组，数组字符串与数字的转换
- 问题： 通过vue-router，实现从页面B跳转页面A，页面A默认展示选择B带过来的参数所查询到的结果列表- 涉及： - 数组字符串与数字的转换 - elementUI的Select选择器，options选项的value值为全等比较，若原有value值类型为数字而传入的是字符串，不会做转换，故value类型需确定好，防止出现问题- 源代码-页面A：//...
2019-08-02 14:22:50
3124
原创 ES8基本特性整理
es8特性::: tipes8标准已于2017年6月发布:::Object.values()遍历对象属性值let obj = {a: 1, b: 2, c: 3}// - 使用Object.keys()获取Object.keys(obj).forEach((key) => { console.log(obj[key])})// - 使用for/of 获...
2019-07-25 17:23:21
453
原创 处理文字溢出省略号代替
html中处理文字溢出单行显示，文本溢出省略号代替tips: 一般在html标签中处理文字溢出，经常会限制标签的宽度，单行文字超出显示省略号。overflow:hidden;white-space:nowrap;text-overflow:ellipsis;效果图代码：// css.content { width: 200px; height: 30px; line-h...
2019-07-15 17:47:02
927
原创 vue项目F5刷新mounted里的函数不执行问题
项目背景在主文件index.vue中初始化页面相关的操作，在mounted中放置用户权限判断并更新store中的权限值，当点击相应组件时mounted可正常工作，但是在用户手动刷新时mounted内的函数并未执行，导致相应组件未获取到权限而显示异常问题解决首先，这跟vue生命周期有关，图就不贴了，直接说原因。当用户f5刷新页面时，整个页面会重新去请求，js的状态变量消失，但是el节点并...
2019-06-28 18:56:43
7471
原创 jsPlumb应用指南（二）应用部分
背景创建一个流程图，一方面需要通过接口获取流程图的基本信息来绘制流程图，一方面可通过连接流程图节点的端点来添加线段。节点的创建通过拖动原型复制。节点的可连接线段端点有四个，分别为topCenter/bottomCenter/leftMiddle/rightMiddle节点连接线段的规则为：同一节点不可连接，每个端点连接线段不做限制引入包npm install jsplumb --s...
2019-06-21 15:09:46
1665
原创 vue拖拽介绍
vue拖拽介绍基本使用方法同HTML5w3school方法介绍draggable为了使元素可拖动，设置draggable=“true”默认情况下，图像、链接和被选中的文本是可以拖动的，因为它们的draggable自动设置为true应用于被拖动元素上的事件dragstart在被拖放的元素上触发该方法（按下鼠标拖动开始）drag触发dragstart事件后，随后触发d...
2019-06-12 10:19:23
919
原创 jsPlumb应用指南（一）概念部分
jsPlumb简介jsPlumb是一个JavaScript的连接库，它可以根据不同需求，在两个元素之间生成连线，一个很典型的应用就是绘制流程图。jsPlumb可以对端点和连接线的样式做出精确的控制，支持拖拽元素，创建/删除连接线等。很方便实现“流程图编辑器”等的应用简单属性介绍source 源对象，JsPlumb通过元素的id属性获取对象target 目标对象（source和targ...
2019-06-10 15:48:10
4806
原创 js针对对象的label值按照字母顺序进行排序
原始数据：let obj = { 0: '中国', 1: '上海', 2: '北京', 3: '天津', 4: '武汉'}转变为数组，排序：let array = []Object.keys(obj).forEach(key => { array.push({ label: obj[key], va...
2019-05-17 16:29:47
693
原创 vue elementUI 如何处理文件批量上传
问题：elementUI的Upload上传组件，通过设置multiple为true，就可以实现多选文件；但是在处理的时候还是一个一个传上去。目前需要在所有文件上传后，将某几个上传错误的结果拼接起来做一次提醒解决：this.$refs.upload.uploadFiles 该属性可以获取上传的文件相关信息，包括上传后后端返回的responsehtmlel-upload ref='up...
2019-03-26 20:53:42
6027
1
原创 ES7基本特性整理
es7特性includes()不使用es7时// 例1：function isFruits(fruits){ if(fruits == 'apple' || fruits == 'banana' || fruits == 'pear'){ return true } return false}console.log(isFruits('bab...
2019-03-10 14:40:20
550
原创 文件上传与下载-前后端处理
文件上传前端组件-使用Element封装的组件<el-upload name="file" class="upload-demo" :action="/saveFiles/" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" multiple :o
2019-03-10 14:36:03
888
原创 理解js函数防抖与节流
一些概念描述 ：函数防抖与节流都是优化高频率js函数执行的手段。本质：在时间轴上控制函数的执行次数作用：防止函数“短时间”的重复执行问题引入：用户在网络比较差的情况下提交表单，多次点击提交按钮导致表单重复提交监听scroll滚动事件，根据滚动位置显示返回顶部按钮函数防抖概念 ：在函数触发N秒后执行，如果在N秒时间内再次触发，则从再次触发的时间节点开始重新计时N秒之后执行。...
2019-02-28 20:13:59
295
原创 VuePress介绍与配置引导
VuePress介绍VuePress ,是一个Vue 驱动的静态站点生成工具，由两部分组成：一个以 Vue 驱动的主题系统的简约静态网站生成工具，和一个为编写技术文档而优化的默认主题。它是为了支持 Vue 子项目的文档需求而创建的。废话不说，具体相关介绍可以看官网介绍~：VuePress在之前写过vuepress搭建的一个项目，地址如下：https://www.tq.xiaoya...
2019-02-23 16:56:05
1345
原创 js对象属性类型
ECMAScript中有两种属性：数据属性和访问器属性* 数据属性 * 访问器属性A、数据属性：包含一个数据值的位置，在这个位置可以读取和写入值，有4个描述其行为的特性1、[[Configurable]]：表示能否通过delete删除属性从而重新定义属性，能否修改属性的特性，或者能否把属性修改为访问器属性，特性默认值为true2、[[Enumberable]]：表示能否
2017-08-08 11:27:11
1376
原创 js深入之call、apply和bind模拟实现
call和apply 作用：调用一个对象的一个方法，以另一个对象替换当前对象。 区别：调用参数形式不同。（call参数依次给出，apply通过Array对象传入） this:谁调用我，我就指向谁 首先看个调用call的栗子：var foo = { value: 1};function fn() { console.log(this.value);}fn.ca
2017-07-26 21:51:47
795
原创 js中‘+’操作符与‘-’操作符的运算规则
下面是笔试或面试经常会遇到的关于字符串与数字加减的问题：var foo = "11"+2-"1";console.log(foo); //111console.log(typeof foo); //numbervar foo = "11"+2+"1"; console.log(foo); //1121console.log(typeof foo); //s
2017-04-16 19:15:17
1377
原创 js动画效果之多物体动画
此案例演示的是多物体控制运动 下面两张图片演示的都是鼠标放在当前li其宽度发生变化，先看效果图，看看两图的区别： 对比： 区别就不说了，很简单，原因：控制多物体运动勿使用公共属性，此处图一是这些li公用一个timer，图二给每个li都添加了timer。代码上：window.onload=function(){ var oli=document.getEl
2017-04-14 13:18:07
1475
原创 js动画效果之缓冲动画
此案例基于之前的案例，上两个例子两个物体所做的都是匀速运动，就像火车进站一样，如果在快到达目的地时速度慢下来，视觉效果会更好，就之前的代码稍微改革速度就好了~下面是效果图对比：（由于上传的是.gif格式的图片，可能效果看起来不是很明显，可以自己试下） js代码实现改动部分（其他与之前相同）var speed=Math.floor((iTarget-odiv.offsetLeft)
2017-04-13 08:59:55
2051
原创 js动画效果之透明度变化
此案例总结的是鼠标移入框内透明度渐变的效果，使用原生js、jquery与css3 3种方法分别实现。照常下面是效果图： 下面是js的实现代码：window.onload=function(){ var odiv=document.getElementById("mydiv"); odiv.onmouse
2017-04-11 08:40:30
782
原创 js动画效果之速度动画
此案例实现的是侧边栏的滑入与滑出，主要用定时器来实现物体滑动时速度的控制，从而实现滑入滑出效果，下面是效果图： 下面是实现的js代码：window.onload=function(){ var odiv=document.getElementById("mydiv"); odiv.onmouseover=function(){
2017-04-10 09:47:03
1436
原创 两栏布局左侧自适应
牛客网上碰到的一个题，应该是某公司的笔试题吧，题目描述很简单：实现如下布局。。 分析：顶部header与底部footer都很好实现，主要就是中间content部分的自适应。此处用到了之前的一个方法：margin负值法。 下面上图分析： 嗯，接下来就是上代码了，还是很好理解的。 html <header> <div class="logo">logo</div>
2017-04-01 09:10:32
449
原创 jQuery获取各种宽高的方法
//屏幕的可视区域宽高 $(window).width() $(window).height() //页面文档宽高 $(document).width() $(document).height() //浏览器当前窗口文档body的宽高 $(document.body).width() $(document.body).height() //网页被卷上去的高度（到左边的垂直宽度）
2017-03-11 21:52:18
462
原创 JavaSsript获取各种宽高的方法
//屏幕的有效宽高 window.screen.availWidth window.screen.availHeight //屏幕的分辨率宽高 window.screen.width window.screen.height //网页可见区域宽高 document.body.offsetWidth document.body.offsetHeight //bod
2017-03-11 21:34:57
547
原创 实现三栏布局中间自适应（二）
margin负值法：实现三栏布局中间自适应。废话不说上代码： 此处是css代码 *{ margin:0; padding:0; } .main{
2017-03-02 21:43:10
468
原创 JAVA选择题云集（二）
/—————-#4 期中考试题#———————–/1 下列说法正确的有（） 。 (2分)class中的constructor不可省略 constructor必须与class同名，但方法不能与class同名 constructor在一个对象被new时执行 一个class只能定义一个constructor2对于类与对象的关系，以下说法错误的是（ ）。 (2分)类是对象的类型 对象
2017-01-03 09:42:24
13679
原创 JAVA程序填空题
1 （检验密码）一些网站设定了一些制定密码的规则。编写一个方法，检验一个字符串是否合法的密码。假设密码规则如下： 密码必须至少有8个字符。 密码只能包含字母和数字。 密码必须至少有2个数字。 请编写一个程序，提示用户输入密码，如果改密码符合规则就显示“Valid password”，否则显示“Invalid password”。public class Main {
2017-01-01 13:00:16
8751
原创 JAVA选择题云集（一）
/—————-#1 第18周练习题#———————–/ /—————-#2 第17周练习题#———————–/ /—————-#3 第16周练习题#———————–/ /—————-#4 期中考试题#———————–/ /—————-#5 其中练习题#———————–/ /—————-#6 10月月考#———————–/
2016-12-26 11:57:52
15666
原创 JAVA判断练习云集
/——————–#1 第18周练习题#————–/ 1 容器是用来组织其他GUI组件的单元，它不能嵌套其他容器。（F ） (1分)2 静态变量是被同一个类的所有实例所共享的。(T）(1分)3 Java中数组的元素只能是简单数据类型。F (1分)4 ArrayList类是线程安全的。F (1分)5 对象是类的实例（instance）。T (1分)6 在Java中，高优先级的可运行线程会抢占低优先级
2016-12-26 11:42:48
9562
原创 从下往上的信息滚动特效
挺简单的一个小例子，就是将网页上一块相同相似的内容的区域放在一个层里，然后将内容从下往上滚动，一般用于网页公告或新闻展示。上代码：<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>从下往上的信息滚动特效</title> <style> *{
2016-11-29 22:39:43
1960
原创 JAVA期中练习题
5-1 找素数(10分) 请编写程序，从键盘输入两个整数m，n，找出等于或大于m的前n个素数。输入格式:第一个整数为m，第二个整数为n；中间使用空格隔开。例如：103 3输出格式:从小到大输出找到的等于或大于m的n个素数，每个一行。例如：103107109输入样例: 9223372036854775839 2输出样例: 9223372036854775907 92233720368
2016-11-16 20:47:28
2212
1
原创 DOM（二）DOM节点关系与操作
1、node类型： js中所有节点类型都继承自Node类型，故所有节点类型都共享相同的基本属性和方法。每个节点都有一个nodeType属性，节点类型由在Node类型中定义的12个数值来表示。在这里需记住主要的三个：Node.ELEMENT_NODE //1元素节点Node.ATTRIBUTE_NODE //2属性节点Node.TEXT_NODE //3文本节点
2016-10-23 12:13:49
541
原创 DOM（一）DOM简介及查找元素的几个方法、操作特性
一、概念： DOM即稳当对象模型，是针对HTML和XML文档的一个API（应用程序接口） D：可以理解为整个web加载的网页文档 O:（对象）类似window对象,可调用属性和方法 M:（模型）网页文档的树形结构 节点层次：数据结构中描述的树形结构可以很好的解释HTML的节点之间的关系。节点可分为三类： 元素节点： 文本节点：标签内的纯文本
2016-10-22 21:52:26
3489
原创 实现三栏布局中间自适应
前两天看到一个面试题，说是让实现三栏布局，中间的自适应，如下图所示： 其实挺简单的，但是换下顺序，有好多人就懵逼了，包括我。。。。这里我总结两种方法来实现： 第一种~定位法：（css代码） *{ margin:0; pading:0; } .container{ width:100%; height:100%; position:re
2016-10-19 22:35:03
636
1
原创 BOM（二）间歇调用和超时调用、BOM其他主要对象
一、定时器（间歇调用和超时调用） 间歇调用：setInterval() 超时调用：setTimeout() 两者都可接受两个参数：第一个参数是要执行的代码片段，可以是字符串也可以是函数，因为此处具有解析功能，直接加字符串容易出错，故推荐使用函数。它们均可返回一个数值ID，分别使用claerInterval(intervalID)和clearTimeout(timeoutID)在调用时间之前可取
2016-10-05 20:11:56
456
原创 BOM(一)--window对象、控制窗口
一、window对象 在浏览器中，window对象有双重角色：既是通过JavaScript访问浏览器窗口的一个接口，也是ECMAScript规定的Global对象。 1、在全局作用下定义的变量或函数都会被自动归在window对象名下：var name="张三"; function a(){ alert("嗨~"); } window.a();
2016-10-05 18:52:54
705
原创 函数声明与函数表达式的区别
函数声明和函数表达式都是定义函数的方法，它们之间存在的差异有两点： 1、执行顺序： 关于函数声明，它有一个重要的特征：函数声明提升，即在执行代码之前会先读取函数声明，即可把函数声明放在调用他的语句之后。例如： myBox(); function myBox(){ alert("myBox"); };而函数表达式与其他表达式一样，在使用
2016-09-28 15:12:00
615
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人