- 博客(55)
- 收藏
- 关注
RSS订阅原创 【Java】- jdk环境变量配置
打开环境变量配置我的电脑-右键-属性-高级系统设置-环境变量JAVA_HOMEJAVA_HOME是一个环境变量用于表示jdk安装的位置一个好处就是如果path中多个地方需要用到jdk路径，直接用%JAVA_HOME%变量表示就可以，假如某一天jdk安装的位置发生变更，只需要改动JAVA_HOME这个变量的值一次就可以是一个约定，某些应用软件会默认寻找JAVA_HOME这个变量获取jdk路径Path操作系统看作一个软件，只有配置在环境变量中的变量也就是程序路径，操作系统才能直接在命令行
2021-03-06 14:54:24
194
原创 【Java】- 何为编译？
简介利用编译程序从源语言编写的源程序产生目标程序的过程从Java这样的高级语言转换成计算机能够识别的二进制语言编译过程发现有语法错误，给出提示信息用法
2021-03-06 14:29:19
296
原创 Babel是什么？
-----------------------------------------------2021.02.09---------------------------------------------本文章包含的内容了解全局 - Babel的作用是什么？学习范围 - Babel的使用方式、配置、Plugins和Presets的区别、preset-env的作用1. Babel的作用是什么？首先要明白ES6的语法比如箭头函数在旧版本浏览器因为兼容问题是无法运行的所以要想办法对旧版本浏览器进
2021-02-09 16:32:46
388
原创 Webpack是什么？
-------------------------------------2021.02.09-------------------------------------------本文章包含的内容了解全局 - Webpack是什么？有什么用？定义目标 - 用Webpack打包一个最简单的文件1. Webpack是什么？有什么用？a. 是一个打包工具可以根据多个文件的依赖关系将多个文件打包成一个或者多个文件，正如官网首页演示的图一样b. 是一个语法转换工具可以借助loader或者插件将代
2021-02-09 11:05:54
300
原创 从HTML到Webpack
纯html+css+javascript<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> body,html
2020-12-01 08:50:30
215
1
原创 PostCSS到底是个啥？
--------------------------------2020.11.25----------------------------------------------当你想要在你的代码加一些新出的CSS属性时，通常要为不同的浏览器给新的CSS属性添加不同的前缀，以此来兼容不同的浏览器。<style>.some-element { box-sizing: border-box; -webkit-box-sizing: border-box; // chrome, safari
2020-11-25 10:36:42
2669
原创 在vue中使用Tailwind CSS
----------------------------------11-18更新---------------------------------------埋个伏笔
2020-11-18 22:07:20
5031
6
原创 WebSocket介绍
--------------------------------11-15更新---------------------------------------------作用任何技术的出现都是为了解决某些问题而存在，存在即合理，带着问题去学习某个新技术也是我一直崇尚的学习方式。回到正题，那么这个WebSocket的出现是为了解决什么问题？答案：为了实现客户端（网页）和服务端（数据库）之间低延迟的双向通信。背景一个网站很大程度上是围绕所谓的HTTP请求/响应规范做出来的。客户端加载了一个网页，基本
2020-11-15 20:55:00
101
原创 HTML DOM-拖拽Table表格行
在看这个示例之前，我推荐先看这篇文章熟悉一下我们是如何在列表中拖拽元素的。我们可以使用同样的技术点应在table表格行上，基本思路就是：当用户开始移动表格行，我们创建一个列表，列表中每个元素从table的每 个行中拷贝得来。我们首先在表格同样的位置展示列表，同时隐藏表格。这个步骤中，移动行相当于列表中的每个元素当用户拖拽元素，我们先得到被拖拽元素在列表中的索引，然后根据最后的索引移动真实表格中的行。先建立table的基础结构<table id="table"> ..
2020-11-10 09:11:51
1477
原创 HTML DOM-在列表中拖拽移动元素
这个示例将会展示如何创建一个可以在里面拖拽移动元素的可以排序列表首先还是我们的HTML结构<div id="list"> <div class="draggable">A</div> <div class="draggable">B</div> <div class="draggable">C</div> <div class="draggable">D</div> <d
2020-11-09 23:04:57
391
原创 HTML DOM生成一个可以拖拽的元素
假设我们想对下面这个元素进行拖拽<div id="dragMe" class="draggable">Drag me</div>修改CSS.draggable { /* 鼠标经过时指明该元素可以拖拽 */ cursor: move; /* 拖拽元素的位置时绝对定位 */ position: absolute; /* 不允许选择到元素里面的内容 */ user-select: none;}为了让其可以被拖拽，我们需要处理
2020-11-09 20:34:50
580
原创 单元测试Vue组件
哎呀，今天太忙了，被实现大数据表格搞得头晕脑涨----------------- 待更新 -------------------
2020-11-05 21:51:30
684
原创 几分钟上手前端单元测试
为什么需要单元测试随着开发的应用功能越来越复杂，人工测试耗费的时间成本将越来越大，而且难免有遗漏，尤其到了上线才发现那可真是心绞痛，所以需要一个测试工具代替人工测试省去大量时间成本。或许有人说在开发阶段编写单元测试什么的很费时间，其实编写单元测试花不了多少时间，思考验证逻辑反倒多一点。这样说吧，你比起一次性开发并测试成功，还是更愿意一次开发二次修BUG。重构某部分代码时，会因为想到修改一处代码，产生十处BUG的蝴蝶效应而动弹不得，单元测试可以避免，目的都是为了代码不同的同时产生相同的结果。..
2020-11-04 21:58:24
179
原创 程序员为什么要写blog？
不为流量，不为名声，为了自己的成长将所学归纳成自己看得懂的话语更方便记忆通过锻炼表达，通过不断练习缩短自己思考表达的反应时间回看文章，用更快的时间唤醒自己的不常用的记忆产生学习动机内容不限，上至天文，下至地理获取读者反馈建议，不要抱着错误的观念而不自知，在错误的道路上越走越远同时翻译成英文，锻炼自己的英语水平，增加国外工作机会每天10点准时上传...
2020-11-04 14:52:16
117
2
原创 uniapp中的onLoad不起作用
在页面组件里使用onLoad是会执行的但如果在页面组件里的子组件使用onLoad不会执行可以vue的生命周期mounted代替
2020-06-22 14:26:55
2836
原创 uniapp使用better-mock在小程序端模拟数据
初始化项目在uniapp项目目录下npm init安装better-mock官方文档npm install better-mock新建文件新建mock文件夹mock文件夹下新建index.js小程序平台要引入dist/mock.mp.jsconst Mock = require('better-mock/dist/mock.mp.js')根据数据模板生成模拟数据const Mock = require('better-mock/dist/mock.mp.js')M
2020-06-21 12:31:38
3703
6
原创 async/await的使用
为什么要用async/await单纯地使用promise对象+then的形式顺序执行，代码使用起来并不优雅，需要一种更接近传统语法的形式异步请求axios的API都是返回的promise对象基本用法async 关键字用于函数上（async函数的返回值是Promise实例对象所以要用then得到返回值）await 关键字用于async函数当中，接在promise对象前面可以得到reslove或者reject的结果 var sum=0 function time
2020-06-21 10:44:04
315
1
原创 promise的使用
为什么需要promise？存在像定时器和ajax请求这样的异步函数异步函数的特点就是代码执行顺序并非按照常规的从上往下执行而且顺序不固定setTimeout(function () { console.log('1') }, 2000 ); setTimeout(function () { console.log('2') }, 1000 ); setTimeout(function (
2020-06-21 09:39:25
145
原创 export和export default的区别
export与export default均可用于导出常量、函数、文件、模块等在一个文件或模块中，export、import可以有多个，export default仅有一个通过export方式导出，在导入时要加{ }，export default则不需要输出单个值，使用export default输出多个值，使用exportexport default与普通的export不要同时使用...
2020-06-20 14:23:58
93
原创 uni-app小程序端获取openid
小程序登录流程步骤获取临时登录凭证codehttps://uniapp.dcloud.io/api/plugins/login?id=loginuni.login({ provider: 'weixin', success: function (res) { console.log(res.code); }});请求登录凭证校验接口获取用户唯一标识 OpenIDuni.request微信官方接口文档uni.login({ provider: 'weix
2020-06-20 10:45:59
9717
6
原创 uni-app小程序端获取定位
使用uni.getLocation API基本用法https://uniapp.dcloud.io/api/location/location?id=getlocationuni.getLocation({ type: 'wgs84', success: function (res) { console.log('当前位置的经度：' + res.longitude); console.log('当前位置的纬度：' + res.latitude);
2020-06-20 09:49:26
2517
原创 form-data、x-www-form-urlencoded、raw、binary的区别
form-data将表单的数据处理为一条消息，以标签为单元，用分隔符分开既可以上传键值对，也可以上传文件当上传的字段是文件时，会有Content-Type来说明文件类型x-www-form-urlencoded将表单内的数据转换为键值对raw可以上传任意格式的文本，可以上传text、json、xml、html等binary只可以上传二进制数据通常用来上传文件由于没有键值，所以，一次只能上传一个文件...
2020-06-19 22:59:06
130
原创 params和body的区别
get请求适合向服务器发送数据量较小的请求比如查询操作请求参数会放在url里，用？分割参数，多个参数用&链接params里的参数会被放在url里，所以get请求时参数添加在params里post请求适合项数据量发送数据量较大的请求比如添加操作，上传文件等参数不会放在url里body里的参数不会放在url里，所以post请求时参数添加在body里...
2020-06-19 22:38:11
8077
原创 响应式居右导航栏
响应式导航栏<nav> <ul> <li><a href="#">About</a></li> <li><a href="#">Work</a></li> <li><a href="#">Contact</a></li> </ul></nav><style> h
2020-06-06 10:42:08
285
转载 font-size: 62.5%的意义
font-size: 62.5%的意义首先，rem是以html为基准。一般的，各大主流浏览器的font-size默认值为16px,此时1rem=16px。如果此时将rem与px进行换算很麻烦，比如0.75rem=12px。为了更方便的进行换算（比如1：10），就可以加样式：html,body{ font-size: 62.5%}设置了62.5%以后就有 1rem=10px，便于用rem指定元素的尺寸（比如1.2rem=12px,1.4rem=14px），这样响应式的时候就可以直接改变
2020-06-06 10:19:44
2174
原创 多行文本水平垂直居中
多行文本垂直居中<section> <h1>Hey I am Mimic</h1> <p>a web developer</p></section><style> section { display: flex; flex-direction: column; justify-content: center; align-items: center;
2020-06-06 09:55:57
184
原创 div中input垂直居中的方法
div中input垂直居中的方法1. absolute+transfrom<div> <input type="text"/></div><style> div{ position: relative; height: 44px; background-color: #fe3c35; } input{ position: absolute; top: 50%; transform: translateY(-50%
2020-06-03 08:00:47
8867
2
原创 RESTful API个人理解
RESTful API个人理解首先REST不是休息的意思，是Representational State Transfer的缩写，即表现层状态转化其实也不用去刻意去理解什么是表现层，什么是状态转化，只要明白跟一般的API有什么区别就可以了前置知识URI和URL找了那么多解释感觉这个解释最清楚HTTP中的请求方式当浏览一个Web页面时，客户端要向服务器发送请求，而这个请求中要包含请求的方法一般的API和RESTful API对比一般的API可能长成以下这个/api/g
2020-05-28 15:59:11
152
原创 vue中利用setInterval实现验证码倒计时
vue中利用setInterval实现验证码倒计时setInterval基本用法setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式setInterval( function () { console.log('hello'); }, 3000)每隔三秒输出一个setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭由 s
2020-05-28 12:07:56
378
原创 input框中内嵌button按钮
input框中内嵌button按钮用途常见的使用场景就是input框中输入手机号然后发送验证码实现大致框架<div class="container"> <input type="text" placeholder="手机号"> <button>发送验证码</button> <input type="text" placeholder="验证码"></div><s
2020-05-27 12:25:13
24424
1
原创 vue中input标签的使用
vue中input标签的使用普通input标签<input type="text" value="value" placeholder="placeholder" name="name">type规定 input 元素的类型,value规定 input 元素的值placeholder规定帮助用户填写输入字段的提示name用于对提交到服务器后的表单数据进行标识在客户端通过 JavaScript 引用表单数据vue中的input标签<inpu
2020-05-26 15:58:31
14662
1
原创 box-sizing：boder-box原理
box-sizing：boder-box原理没有border、padding、margin的盒子<style> div{ width: 200px; height: 200px; background-color: #f1f1f1; }</style>此时盒子的大小: width有border、padding和margin的盒子<style> div{ widt
2020-05-26 15:10:16
185
原创 vuex中subscribe的使用
vuex中subscribe的使用会在每个 mutation 完成后调用，接收 mutation 和经过 mutation 后的状态作为参数App.vuethis.$store.commit('add')store.jsconst store = new Vuex.Store({ state:{ name:'zs', age:18 }, mutations:{ add(state){ consol
2020-05-25 17:20:40
3935
1
原创 使用vue.config.js模拟请求数据
使用vue.config.js模拟请求数据新建JSON文件,写下要请求的数据{ "data": [ { "name": "zs", "sex": "男" }, { "name": "ls", "sex": "女" } ]}新建vue.config.jsconst user = require('./api/user.json') // 引入json数据module.exports = { dev
2020-05-25 16:31:21
702
原创 sync修饰符的作用和用法
sync修饰符?一个组件上只能定义一个v-model，如果其他prop也要实现双向绑定的效果该怎么办呢？ 简单的方法是子组件向父组件发送一个事件，父组件监听该事件，然后更新prop。具体如下：// info.vue组件定义了一个value 属性， 和一个valueChanged事件<template> <div> <input @input="onInput" :value="value"/> </div></te
2020-05-25 10:00:56
2535
原创 javascript对树状数据结构的递归思路
javascript对树状数据结构的递归思路数据的结构var data = [{ id: 1, name: '家电', goods: [{ id: 11, gname: '冰箱', goods: [{ id: 111, gname: '海尔'
2020-05-24 18:50:50
237
原创 javascript对象赋值和拷贝
javascript对象赋值和拷贝基础知识对象指向内存中的一块地址直接赋值会导致两个变量指向同一块地址var test1={ name:'zs'} var test2 = test1test2.name='ls'console.log(test1); // { name: 'ls' }console.log(test2) // { name: 'ls' }结果就是修改其中一个对象的值会导致另一个对象也跟着改变浅拷贝针对属性只有值类型有以下三种解决
2020-05-24 17:31:37
113
原创 如何在对象上使用变量作为属性名
如何在对象上使用变量作为属性名正常情况console.log({name:'zs'});// 输出{ name: 'zs' }// 没有异议如果使用变量作为属性名呢？var name = 'key'console.log({name:'zs'});// 结果还是{ name: 'zs' }正确使用变量作为属性名的方法var name = 'key'console.log({[name]:'zs'});// 输出{ key: 'zs' }如何在对象上使用变量作为
2020-05-23 18:14:33
992
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人