- 博客(17)
- 收藏
- 关注
RSS订阅原创 原来科技感的三维地图可以这么简单实现
下午摸鱼时接到一个客户的数字孪生项目的需求，客户什么也没说，就要求“炫酷”和“科技感”地图，还要把他们的模型都放上去，起初我以为又是一个可视化大屏的项目，准备用高德地图应付过去，然后他们又在群里发什么要求高之类的，我们的数据种类多，说什么高德、百度、Mapbox、Cesium之类框架都试过了，满足不了需求，好嘛，这下给我犯了难了，会的技术栈全都给我排除了, 手撸Three.js源码我可不干，于是就在网上晃悠，尝试找一些灵感
2024-04-08 10:40:19
909
1
原创 Vue使用函数组件和JSX语法封装组件
使用Vue的render渲染函数封装UI组件的思路（一）在介绍之前，先说一下使用场景，仅仅用于简化代码，降低无用的引用以及耦合度，并不是要代替什么，大佬不要抬杠。有3种不同的列表，分别为List01.vueList02.vueList03.vue对应的样式如下：按照我们平时的使用方法，如果需要在不同的组件使用，则需要如下引入方式，想想如果List组件特别多，有几十个呢....import List01 from "./List01.vue"import Li
2021-01-20 15:55:26
1052
转载 关于js原型链和继承的最详尽、最大白话的解释（一）
关于js中的原型、原型链、继承，很多人都是一知半解，甚至从事了多年前端开发的同学，也不能够完全理解，因为大多数我们工作中都是用的框架，也很少涉及这些东西。但如果要想深入理解这些框架的原理和源码，这个坎还是要跨过去的，废话不多说，直接看文章。一：js中对象的分类—>函数对象和普通对象JavaScript 中，万物皆对象！但对象也是有区别的。分为普通对象和函数对象，Object 、Function 是 JS 这个语言自带的函数对象。下面举例说明var obj1 = {}; var obj2 =ne
2020-09-01 14:46:18
244
原创 Vue实现渐变色进度条
今天在封装一个个类似于下面这样的进度条组件功能要求进度条的总格子数可以自定义当前件数的占比和当前蓝色格子数对应格子的蓝色渐变要符合UI设计这个渐变色的处理浪费了好一会功夫，下面看一下我的实现思路，大神勿喷啊，后面给出源码首先确定props里面的值，即组件需要接收的值这里只有名称、总数和当前值props:{ name:{ type:String, default:()=>('数据名称') }, total:{ type:Number, d
2020-08-24 22:31:45
3604
2
原创 2020年4月最新前端面试题，适合1-2年经验
最近在南京面试，大部分都是电话面试，仅有的三家现场面试，面试题给大家看看，新鲜出炉的。我是面试的1-1年经验的，最终结果还好，收到了三个offer，不过都是一些中型公司，毕竟自己太菜，大厂进不去。第一家 薪资9k+12元餐补每天v-for中，key的作用是什么？什么是vue-loader?什么是mixinvue-cli如何配置反向代理props如何指定类型？Vue生命周期中，cr...
2020-04-20 19:52:46
1064
原创 这可能是最简单直观的call()、bind()、和apply()的区别和联系
面试的时候被问到 bind、call和apply的区别，当时脑袋似懂非懂，事后通过一个简单的例子写出来分享给大家首先说一下三者的共同点共同点：都是用来改变函数的this对象的指向的。第一个参数都是this要指向的对象。都可以利用后续参数传参。一般用于借调其他对象的方法至于不同点，用一个例子区分：新建两个对象，平板对象pad和电脑computer,只有pad里有介绍intro方法...
2020-04-20 19:30:29
280
原创 使用vue和vue-router实现单页应用底部tab切换
仿照淘票票App做了一个底部的tab切换，目前大多数App都是使用这种方式切换的，先看图1.基础栈：Vue、 Vue-router 、vue-cli、Vue.js devtools、npm、webpack2.代码下载连接和安装方式：https://github.com/Hbuilderx/vue-tab-slide3.使用方式看README.md文件，代码都有功能注释...
2019-07-16 18:16:06
2034
1
原创 React零基础入门02--JSX语法基础
JSX语法简介JSX是js的一个高级语法，在运行时通过Babel转换为低版本的代码，使用JSX语法的主要目的是为了编程的逻辑更清晰和快速，提升代码可读性和性能。下图解释了JSX编译的过程基本使用新建一个01-HwlloWorld.html文件,内容如下,我们使用JSX语法在页面输出一句“Hello World”<!DOCTYPE html><html lang="e...
2019-07-15 19:10:36
421
原创 React零基础入门01--React入门和环境搭建
前沿，我也是一个前端菜鸟，也是自学React，期间大大小小碰到了很多坑，现在将自己碰到的坑积累成经验分享给大家，大神勿喷，希望大家可以指点一下React简介React起源于Facebook的内部项目，该公司在开发自己的Instagram网站，想去市面上找一个jsMVC框架进行开发，找找去，都达不到预期的效果。于是他们就自己开发了React框架，后来发现挺好用，经过完善之后就开源了，围绕Re...
2019-07-15 18:48:51
588
原创 js中各种this超详细解释
1-全局中的this全局中的this就是window对象<script> console.log(this);//window</script>2-事件处理函数中的thisvar box=document.getElementById("box"); box.onmouseover=function(){ console.log(thi...
2019-06-27 17:32:06
3089
原创 Chrome的最小字体12px限制最终解决办法
相信不少做网站的用户会有这样一个问题，Chrome默认最小字体是12px（最新版英文也有此问题），这个是 Chrome 为了更好显示中文设计的，但是这样一来就会出现某些上标、下标字体过大，影响用户体验。之前在开发Hybid App的时候也被它困扰了很久,在百度上查了很久，网上所有的解决方案都惊奇地相似，只有下面两种：1-针对谷歌浏览器加前缀进行适配html{ -webkit-tex...
2019-06-27 17:21:38
28249
26
原创 超详细的rem+vw移动端屏幕适配方案
在说具体内容之前，我们必须了解几个概念，就是：Retina屏、物理像素、设备独立像素、设备像素比在CSS中我们一般使用px作为单位，需要注意的是，CSS样式里面的px和物理像素并不是相等的。CSS中的像素只是一个抽象的单位，在不同的设备或不同的环境中，CSS中的1px所代表的物理像素是不同的。在PC端，CSS的1px一般对应着电脑屏幕的1个物理像素，但在移动端，CSS的1px等于几个物理像素是...
2018-11-23 11:10:10
12647
原创 js中事件冒泡
我们先来说一下什么是事件冒泡事件冒泡：当一个元素接收到事件后，会沿着DOM结构将事件逐层传递到其父元素上 在页面中写三个嵌套的div，dom结构如下 </head> <body> <div id="one"> <div id="two"> <div id="three">
2018-11-16 11:33:26
554
原创 js中offset家族、client家族、scroll家族详细解释
1-offset家族offset家族有以下几个值offsetWidth offsetHeight offsetLeft offsetTop offsetParent offsetWidth和offsetTop用来获取对象自身的宽度和高度 ，包括内容、边框和内边距，即：offsetWidth /Height= width + border + padding，与其...
2018-11-16 09:24:49
404
1
原创 javascript中的变量与作用域
在说变量作用域之前先了解以下几个概念块级作用域：在其他语言中，任何一对花括号内的语句都属于一个块，在这个块中定义的所有变量在代码外部都是不可见的,但是在js中，外部可以访问{ var age=12; } console.log(age); //控制台输出12全局变量：定义在script标签中或者不属于某个函数的变量，在任何地方都可以访问的变量var name...
2018-11-16 08:55:18
166
原创 CSS3 transition 属性实现小米商城商品展示效果
前端小白一个，最近学习了CSS3的transition属性，就想做一个效果练练手，下面是参考小米商城的商品展示做的一个动态效果。下面贴上代码：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>小米商品展示css3动画</title> &am
2018-06-28 12:50:56
4955
1
转载 css中单位px和em,rem的区别
国内的设计师大都喜欢用px，而国外的网站大都喜欢用em和rem，那么三者有什么区别，又各自有什么优劣呢？px特点1. IE无法调整那些使用px作为单位的字体大小；2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位；3. Firefox能够调整px和em，rem，但是96%以上的中国网民使用IE浏览器(或内核)。px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分...
2018-06-03 09:00:25
833
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人