- 博客(31)
- 收藏
- 关注
RSS订阅原创 临时抱佛脚面试题
v-if vs v-showv-if和v-show的区别v-if是惰性的，当条件为真时才会开始渲染条件块。而v-show不管初始条件是什么，元素总是会被渲染，只是简单的基于CSS进行切换。(display:none/block)v-if有更高的切换开销，而v-show有更高的初始渲染开销。v-if和v-show的应用场景如果在运行时条件很少改变(如游戏界面)，使用v-if如果需要非常频繁地切换(如tab选项卡)，使用v-show注意！ v-show 不支持 元素，也不支持
2021-08-09 22:09:01
259
原创 如何获取到今天的年月日日期？
有些需求场景需要获取到今日的年月日，于是封装成函数便于调用。let year = new Date().getFullYear();let month = new Date().getMonth() + 1 < 10 ? "0" + (new Date().getMonth() + 1) : new Date().getMonth() + 1;l...
2019-11-27 16:20:56
559
原创 项目里的console.log()如何一次清除？如何封装一个console.log()打印函数？
console.log大家都很熟悉，在调试项目的时候大家都会常用，但是用时一时爽，删除火葬场。虽然用vs code里的全局搜索删除也不是不可以，但是总是觉得不够优雅，所以干脆封装成函数，最后直接在函数中注销，省时省力。函数let Console = function (key) { console.log(key);};export default Console;引入...
2019-11-27 15:30:02
2359
1
原创 前端如何压缩图片？压缩图片函数封装
前端压缩图片很常见，上传头像图片啥的，都需要前端压一下再给后端，于是乎就封装成函数，全局引入一下，随时随用。压缩图片函数let ImgFile = function (e, maxWidth, maxHeight) { return new Promise(function (resolve, reject) { var file = e.target.files[...
2019-11-27 15:02:27
559
原创 如何判断用户使用的设备是手机or电脑or平板？
这里是封装成了一个函数，在vue里直接import使用即可函数let userEqu = (function () { var ua = navigator.userAgent, isWindowsPhone = /(?:Windows Phone)/.test(ua), isSymbian = /(?:SymbianOS)/.test(ua) ||...
2019-11-27 14:48:17
815
原创 React 中 setState({key:value})，key是一个变量时，react会直接把它当作字符串
React 中 setState({key:value})，key是一个变量时，react会直接把它当作字符串开始一直没发现问题所在，打印this.state.key发现值也是对的，后来发现是react直接把它当作字符串了import React, { Component } from 'react';import { Button } from 'antd';class Demo e...
2019-04-12 10:39:30
3165
原创 git流程以及常用命令的整理
git流程下载最新的项目git clone (项目地址)开发前远程同步别人的代码git pull origin （master/分支）开发完成后确认变化git status 无变化-nothing to commit 有变化-显示变化的文件名添加到缓存区git add （文件名/.） 用.表示提交所有修改的文件添加到本地...
2019-03-19 19:56:27
161
原创 React生命周期的基本用法
组件的生命周期可分成三个状态：Mounting：已插入真实 DOMUpdating：正在被重新渲染Unmounting：已移出真实 DOMimport React, { Component } from "react"class Test extends Component { constructor(props) { super(props); }...
2019-03-01 16:57:15
292
原创 react父组件调用子组件的方法 父子组件传值
注意点写在上边比较醒目方法必须写成箭头函数，不然this的指向会出问题。（不用箭头函数的话要用this.fn.bind(this)修正this的指向）父组件向子组件传值/方法比较简单，都是在属性中传然后在子组件中props获取。子组件向父组件传值是通过事件进行传值。父组件向子组件传值//父组件中import React, { Component } from "react";i...
2019-02-28 17:48:18
6045
原创 Promise 封装 Ajax （面试题）
function ajax(url){ return new Promise(function (resolve, reject) { var xhr=new XMLHttpRequest();//实例化 xhr.open('get',url,true); xhr.send(); //将请求发送到服务器...
2018-12-24 14:42:38
646
原创 webpack简易上手版（内含配置但是无过多讲解）
//打开cmd或者powershell-mkdir wbpack //随便在哪新建一个文件夹-cd wbpack-npm init -y-npm i webpack webpack-cli webpack-dev-server -D-mkdir src-mkdir public-再src下创建index.js(入口文件)-创建webpack.config.js并配置 mod...
2018-12-19 11:01:47
107
原创 自己封装一个v-model指令
在Vue.js中我们通过v-model可以轻松实现双向绑定，然而这种效果是如何实现的呢？首先是vm层Vue.component('m-input',{ template:"#m-input", props:['username'], data(){ return {} },})var vm=new Vue({ el:"#main", data:{ username:''...
2018-12-17 09:16:27
2255
原创 Vue面试题整理（一）
一.v-if vs v-showv-if和v-show的区别v-if是惰性的，当条件为真时才会开始渲染条件块。而v-show不管初始条件是什么，元素总是会被渲染，只是简单的基于CSS进行切换。(display:none/block)v-if有更高的切换开销，而v-show有更高的初始渲染开销。v-if和v-show的应用场景如果在运行时条件很少改变(如游戏界面)，使用v-...
2018-12-12 10:34:23
384
原创 easyui datagrid 表格能不能居中显示
今天用easyui做了一个简单的表格，但是在手册中没有找到设置表格居中的方法，这里分享给大家自己的方法在浏览器中右击点开检查，会看到多出这个div，它有三个class，只要在css中用类选择器给它设置一个margin:0 auto就可以了最好用datagrid因为其他两个类于弹窗的重复的，设置会影响到弹窗。.datagrid{ margin:20px auto;}...
2018-12-07 16:52:16
2720
2
原创 用cookie实现简单的用户登录验证
一共是两个页面，一个路由登录页面-html<form> <label for="username">用户名：</label> <input type="text" name="username" id="username"><br/> <
2018-12-06 12:42:08
14236
原创 原生实现 跨域资源共享JSONP
JSONP的原理是<script src=''></script>script标签内的src可以解析任何符合js语法标准的文件（后缀名不重要，内容重要）实现原理的代码（方便后面封装的理解）在请求页面中<head> <script src="http://127.0.0.1:8081/js"></script></..
2018-12-04 14:10:17
142
原创 如何封装一个cookie？更方便的使用
在使用cookie的时候我们发现，cookie的用法不是特别方便，这里我们可以自己封装一个cookie对象，便于使用var cookie={ getAll:function(){ var arr=document.cookie.split('; '); var obj={}; for(var i=0;i<...
2018-12-01 12:35:05
837
2
原创 原生实现ajax
在这里将get和post请求用原生实现ajax稍做整理。在此之前先了解一下方法xhr.open(method,url,async)method：请求的类型；GET 或 POSTurl：文件在服务器上的位置async：true（异步）或 false（同步）onreadystatechange事件当请求被发送到服务器时，我们需要执行一些基于响应的任务。每当 read...
2018-11-29 20:50:49
1022
原创 如何创建一个自己的npm包，并且上传到npm官网上
1.首先先新建一个文件夹，文件夹的名字就是我们包的名字cmd命令2.然后再mynpm里新建一个index.js，内容是我们包的内容module.exports={ eat:function(){ var arr=['巧克力火锅','海底捞','海盐泥巴奶茶','炭火烤肉', '国王栗子挞','年轮蛋糕','肥宅快乐水','草莓裸...
2018-11-27 20:30:16
1800
原创 js如何取消事件？
事件处理程序分为DOM0级和DOM2级，如果是用onclick方式绑定的事件可以用如下方法取消：btn.onclick=null;//删除事件处理程序如果使用addEventListener()方法添加事件，可以通过removeEventListener()移出事件，需要注意两点：1.removeEventListener()的第三个参数必须和addEventListener()方法的第三...
2018-11-25 22:46:47
13659
1
原创 如何解决jQuery中动画多次触发出现卡顿，延迟的问题
当鼠标连续点击按钮触发动画事件时，第二次触发总会有几秒延迟。解决方法是在每次触发动画事件前先把所有动画都取消掉。//编辑 $('table').on('click','.edit',function(){ $("#editWrap").stop(true);//清除元素的所有动画 //这里省略动画效果 }...
2018-11-24 16:14:12
3712
原创 关于如何固定表格中列的宽度
在表格中就算我们已经固定了表格的宽度和第一行所有列的宽度，可是当第二行中的列的内容发生改变时还是会挤压到其他列，这里给大家一个解决方法。<table style="table-layout:fixed;"></table>加上style="table-layout:fixed;">这个就欧凯啦~...
2018-11-24 15:54:26
1186
2
原创 jQuery实现滚动条上下滚动时，div透明度发生改变
css代码.top{ width:100%; height:3rem; background-color:rgba(173, 216, 230,0); position:fixed; line-height: 3rem;}js代码$(window).scroll(function(){//window是原生对象，需要加$转换成jQuery对象 ...
2018-11-20 19:54:53
1254
原创 jQuery链式操作——模拟计算器
var obj={ initNum:0, add:function(a){ this.initNum+=a; return this;//this指向obj }, min:function(a){ this.initNum-=a; retu...
2018-11-19 23:31:45
353
原创 JS创建表格时如何设置colspan属性?
今天在复习时发现了一个问题，就是我用createElement() 方法创建一个td元素时，我想改变的 td 的 colspan=‘2’，创建完后手动添加 td.colspan='2';浏览器没有给我反馈。查阅资料后发现应该这样加 td.colSpan='2';s要大写...
2018-11-17 17:03:11
3586
原创 通过onhashchange事件，点击a标签，文本框出现对应内容
效果css代码 a{ display: inline-block; text-decoration: none; width: 100px; height:50px; line-height:50px; text-align: center; color:#999; ...
2018-11-16 19:33:30
741
原创 根据列表radio选中的不同状态显示不同的背景色
不多说直接上代码，不，还是先看个效果吧现在上代码css代码*{ margin:0; padding:0;}ul{ margin-top:50px; margin-left:250px; width:711px; border-top: 1px solid #ccc;}ul li{ width:650px; height:5...
2018-11-15 22:44:30
1447
原创 关于 for 循环中 i 的值
不知道大家有没有发现一个问题，当在一个 for 循环中直接打印 i 时候，i 的值并不是我们想的那样。html代码<ul> <li>1</li> <li>2</li> <li>3</li></ul>先获取到页面中的li var lis=docum
2018-11-14 18:30:12
6779
原创 关于this的指向问题
JS中this指向谁是个很头疼的问题，这里有三道题分享一下，希望能有点帮助html代码<button id="btn">submit</button>js中先获取到btnvar btn=document.getElementById('btn');一.fn的this指向谁 var fn=function(){ console.log(this); ...
2018-11-13 22:41:40
82
原创 JS判断checkbox是否全被选中，当手动将所有checkbox都选中时，全选checkbox自动选中
JS判断checkbox是否全被选中，当手动将所有checkbox都选中时，全选checkbox自动选中html代码<input type="checkbox" id="topBtn">全选/取消 <ul> <li> <input type="checkbox" class="item&qu
2018-11-13 20:04:39
6080
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人