- 博客(23)
- 资源 (10)
- 收藏
- 关注
转载 Vue底层实现原理概述
前言最近在研究 剖析Vue原理&实现双向绑定MVVM 这篇文章,一边学习一边总结一下自己的思考。Vue是一个典型的MVVM框架,模型(Model)只是普通的JavaScript对象,修改它则视图(View)会自动更新。这种设计让状态管理变得非常简单而直观。那么Vue是如何把模型和视图建立起关联的呢?实现原理概述这是前言提到的文章里的代码,一段典型的体现了Vue特点的代码:<...
2020-03-19 16:11:49
303
转载 前端应该掌握的一些技能
css 1、盒模型 2、flex 3、css单位 4、css选择器 5、bfc 清除浮动 6、层叠上下文 7、常见页面布局 8、响应式布局 9、css预处理,后处理 10、css3新特性 animation和transiton的相关属性 animate和translate 11、display哪些取值 12、相邻的两个inline-block节点为什么会出现间隔,该如何...
2020-03-19 14:56:08
218
转载 Vue中computed和watch的区别
计算属性computed :支持缓存,只有依赖数据发生改变,才会重新进行计算不支持异步,当computed内有异步操作时无效,无法监听数据的变化3.computed 属性值会默认走缓存,计算属性是基于它们的响应式依赖进行缓存的,也就是基于data中声明过的数据通过计算得到的如果一个属性是由其他属性计算而来的,这个属性依赖其他属性,是一个多对一或者一对一,一般用computed5.如果c...
2020-01-16 15:37:20
293
转载 Flex布局完全教程
背景介绍Flexbox 布局(也叫Flex布局,弹性盒子布局)模块目标在于提供一个更有效地布局、对齐方式,并且能够使父元素在子元素的大小未知或动态变化情况下仍然能够分配好子元素之间的间隙。Flex布局的主要思想是使父元素能够调节子元素的高度、宽度和排布的顺序,从而能够最好地适应可用布局空间(能够适应不同的设备和不同大小的屏幕)。设定为flex布局的父元素(容器)能够放大子元素使之尽可能填充可用...
2020-01-15 11:45:50
465
转载 CSS中 box-sizing 属性
box-sizing 含有三个属性,分别是 content-box,border-box,inherit1.content-box border和padding不计算入width之内;2.border-box border和padding计算入width之内;3.inherit 规定应从父元素继承 box-sizing 属...
2020-01-15 11:20:43
171
转载 外部引用CSS样式link和@import两种方法区别
1、link方法<link rel="stylesheet" rev="stylesheet" href="style.css" type="text/css" media="all" /> 2、@import方法<style type="text/css"> @import url("style.css"); //@impor...
2020-01-15 11:15:10
163
转载 css里px、em、rem的区别和应用
第一:px,em,rem的区别在哪?Px是一个绝对字体大小em则是基于基数(比如:1.5em)来计算出来的相对字体大小。这个基数是需要乘以当前对象从其父级遗传字体大小。rem是基于根节点(比如html)的字体大小进行计算的。先说em 如果你的默认父级容器字体为16px ,那么2em=2*16px<div class="parent" style="font-size: 16px"&...
2020-01-15 11:11:31
140
转载 如何保持浮层水平垂直居中
(1)利用绝对定位和transform<div class="parent"> <div class="children"> </div></div>.children{ position: absolute; top: 50%; left: 50%; -webkit-transform: t...
2020-01-15 10:49:03
233
转载 回顶部及缓动滚动到某个位置
前言今天这篇文章应该是javascript回到顶部滑动效果及点击导航滑动到相应热点的效果,这篇文章的升级版。写这篇文章的时候,可能三大框架(react,vue,angular)等还没有流行,还是jquery的时代。如今,前端发展迅速,这篇文章已经过时了。那么新时代,热点动态滚动,及回到顶部用什么方法呢?实现方案新时代实现这个动画方法很多,今天主要介绍4种吧,由推荐的简单办法,到js方案。纯...
2020-01-14 11:33:51
286
转载 js获取某dom到根元素的offsetLeft/offsetTop
前言大家知道,offsetLeft和offsetTop都是获取当前元素到其定位父级(offsetParent)的距离,我前面也有很多文章介绍宽高和offset,例如:https://www.haorooms.com/post/js_jquery_height 等 在实际的开发过程中,我们通常要获取dom到根元素的距离。这个如何做呢?思路其实很简单,父元素是offsetParent,我们循环查...
2020-01-14 11:30:01
1731
转载 H5/js与App的通讯方式小结
前言H5/js与App的通讯,我们公司基础框架是封装了Bridgejs,但是是内部项目,不对外开源。说起这个通信,有一个开源的项目,WebViewJavascriptBridge,需要通信的可以看下这个开源的框架:https://github.com/marcuswestin/WebViewJavascriptBridge 但是简单的通信其实没有必要引入这个框架。其实就是拦截和注入2个部分通讯...
2020-01-14 11:26:56
1336
转载 js数组并集,交集,差集的计算方式汇总
前言今天主要总结一些js数组操作并集,交集,差集的一些方式。发现这些方式在工作用经常遇到,方法有很多种。今天主要总结一下我在工作用通常使用的方式,及一些简单的实现。其实我前面很多文章中都提及了我在工作中用的一些方式。例如:我前面文章讲includes方法,时候就提到了计算交集及差集。还有之前文章去重的方式,其实去重就是取并集的一种方式嘛!一、new Set 方式实现这种方式实现起来比较简单,...
2020-01-14 11:19:47
2492
转载 JS数组对象去重及求差值
前言之前文章有对数组去重及求差值做总结,可以参考文章js数组并集,交集,差集的计算方式汇总,去重的方式面试中经常提到,可以参考。 数组是这么操作,有小伙伴问数组对象应该如何操作呢? 显然,数组对象和数组的操作方式还是有点区别的。这篇文章简单总结一下。去重之前纯数组去重的方式,对数组对象来说,显然不是很合适。提供2中思路1、利用临时对象存储key的方式这种方式之前我是经常这么用,包括处理数...
2020-01-14 11:13:43
2110
转载 记录你可能不知道的html a标签特性
前言总结几个html蛮实用的,但是你可能不知道的特性。当然,这么文章后面还会陆续补充一些。一、关于a标签的属性a标签,我们用的太多了,可以说每个web开发应该都知道,但是这个标签的一些属性你知道吗? 我们来看下a标签的一些属性1、download属性,这个不稀奇,我之前有文章介绍过:https://www.haorooms.com/post/qd_ghfx这篇文章第八条有介绍。2、t...
2020-01-14 11:09:11
530
转载 文件上传之剪切板上传及大文件分片上传和断点续传
前言文件上传是开发中经常遇到的,市面上也有很多插件。直接封装了上传的方法,使用起来很简单。使用vue和react技术栈的同学,都使用了element和antd的上传,因此,拖拽上传和一般上传,今天这篇文章不做解释。今天主要总结一下剪切板上传和大文件分片上传及断点续传的内容。一、剪切板上传剪切板上传就是复制电脑上的图片或者文件,或者网络中的在线图片,然后粘贴到指定位置上传的方式。关于剪切板,...
2020-01-14 10:52:26
697
转载 vue项目中引入element-ui时,如何更改主题色
vue项目中引入element-ui时,如何更改主题色https://www.cnblogs.com/yuwenjing0727/p/9450492.html在我们做项目时,我们经常会遇到切换主题色的功能,下面我们就来说一下通过颜色选择器我们就能改变项目的主题颜色代码如下:颜色选择器所在组件:top-theme.vue内容如下:<template> <e...
2019-05-08 20:50:33
2897
转载 树表格的实现
树表格的实现https://www.cnblogs.com/yuwenjing0727/p/9487779.html有时候我们会遇到表格树的展示,类似于下图的需求:其中组件的封装主要在table-tree文件夹内:main.vue的内容如下:<template> <el-table :data="formatData" :stripe="...
2019-05-08 20:30:50
853
转载 动态加载CSS,JS文件
动态加载CSS,JS文件https://www.cnblogs.com/yuwenjing0727/p/9565748.htmlvar Head = document.getElementsByTagName(‘head’)[0],style = document.createElement(‘style’);//文件全部加载完成显示DOMfunction linkScriptDOMLoa...
2019-05-08 20:26:15
218
原创 hightcharts 鼠标提示框信息
hightcharts 鼠标提示框信息 <el-row :gutter="12" class="mb20" v-if="isShowHighcharts"> <el-col :span="24"> <el-card class="box-card" :shadow="shadow"> <el-row :gutter="12">...
2019-05-08 20:23:39
956
转载 基于vue的滚动条组件之--element隐藏组件滚动条scrollbar使用
基于vue的滚动条组件之–element隐藏组件滚动条scrollbar使用https://www.cnblogs.com/yuwenjing0727/p/9579512.html在项目中,总是需要用到滚动条,但windows浏览器默认的滚动条是很丑的,为了页面美观,可以考虑优化滚动条样式。vue Element UI官方文档上并没有放出滚动条相关的示例说明,但是实际上是有这么一个组件的,可...
2019-05-08 20:15:49
343
转载 vuex的学习例子
vuex的学习例子最近在学习vuejs,一直有听说vuex,用来实现多组件共享的一种状态管理模式,但是网上都说,不要为了用vuex而用vuex,大概意思就是尽量少用vuex,一些小项目可以用bus来实现组件之间的传值问题。虽然说不用vuex,但至少要知道这是个什么东西吧?还要学会怎么用。趁现在有点时间,弥补自己的不足。一些概念性的东西,还是看官方文档吧。Vuex2.0。我们先来看看官网的一张关...
2019-05-08 20:10:31
160
转载 深入javascript之原型和原型链
深入javascript之原型和原型链https://www.cnblogs.com/yuwenjing0727/p/9909738.html原型和原型链是js中的难点也是重点,明白了原型和原型链会让我们在后面不管是学习还是工作都会更加高效,并且原型和原型链会是面试中必不可少的话题。看完此篇文章一定会让你对原型,原型链有深刻全面的了解。一,函数对象所有引用类型(函数,数组,对象)都拥有__...
2019-05-08 20:01:48
92
转载 三张图较为好理解JavaScript的原型对象与原型链
三张图较为好理解JavaScript的原型对象与原型链https://www.cnblogs.com/yuwenjing0727/p/9914149.html最近从网上看到别人详细得讲解了js的原型对象和原型链,看完感觉是看得最清晰的一个,于是,摘录到自己博客里对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与__proto__混淆,二来它们之间的各...
2019-05-08 19:54:27
138
Handsontable-一款仿 Excel效果的表格插件
2018-04-10
quickui界面预览
2018-03-29
miminium-master后台系统源文件
2018-03-14
metronic-master后台系统源文件
2018-03-14
porto-admin后台系统源代码
2018-03-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人