三哈同学-CSDN博客

原创 canvas 两种拖尾效果实现烟花

年关将至，***市区又禁放烟花，但是又非常想看烟花肿么办呢，我们可以用 js 在网页上实现烟花的效果，下面我们将功能进行拆解。

2024-02-08 11:36:21 592

avue基于element-ui + vue；表单组件用户数据（model）、内置规则（options）、钩子函数optionsmenuBtn尾部按钮去除submitBtn提交按钮隐藏emptyBtn取消按钮隐藏labelWidth表单的文字widthformslot：true（开启自定义表单插槽的方式）设置为插槽表单，默认prop名字formatter（函数 =》表格选择器）处理选择款显示的字段gutter（调节表单之间的间距）

2021-03-12 11:17:35 1036

原创 webpack学习记录

前言以前的时候就使用过webpack，但都只是会使用基本的配置，优化方面的都没有去了解一下，趁过年有休闲时间。对webpack常用的东西进行一次总结、分析。毕竟webpack这东西写完又忘记，忘记又去学，不如自己写一篇文章记录下来。这里只是记录一下学习思路，以及学习的总结，并不会做深入详细的说明。webpack的五个核心配置mode编译环境，不同的环境webpack会提供不同机制entry文件核心入口，可设置单入口和多入口outputwebpage编译输出时的路径，mo

2021-02-10 11:26:37 95

原创九种简洁的Vue数据通讯

在编写一个vue项目的时候，组件之间的数据通信是必不可少的。也是非常的重要的一步。今天写几种vue中组件的数据通信方式以及应用场景。props&@props父组件把数据通过v-bind这个指令绑定在子组件参数上传下去.子组件在props这个属性获取.props可以以数组和对象的形式接收.如下数组形式// 父组件<Children v-bind:msg="msg"></Children>// 在子组件上定义props: ["msg"] //字符.

2020-11-29 21:36:00 164

原创简单实现虚拟dom和diff算法.

写一份vue实现虚拟dom和dom更新diff算法.简单实现vue中的虚拟dom和dom-diff算法很多人在面试的时候,都会被问到虚拟dom是什么,vue的diff如何实现等问题.js中通过直接操作真实的dom会消耗很大性能. 把真实的dom转化成虚拟dom来表示.更新dom的时候直接操作虚拟dom能提高很大性能.虚拟dom是什么?根据dom树生成对应树形结构对象.说白了虚拟dom就是一个对象,只不过把dom树通过对象来表示.实现虚拟dom在vue中render函数的第一个参数creat

2020-11-24 11:14:02 212

原创 webapck从零搭建vue

需要安装到的一些依赖js相关通过npm安装 @babel/core @babel/preset-env babel-loader @babel/polyfillcss相关css-loaderstyle-loadernode-sasssass-loaderpostcss-loaderautoprefixerwebpack相关webpackwebpack-cliwebpack-dev-serverwebpack-mergevue相关vuevue-loadervue-rou

2020-08-29 14:48:30 304

原创我常写的移动端1px

移动端的显示1px边框的时候，总是会粗一丢丢。写下一个常用的方法，就是用伪元素的方式制作。.border-1{position:relative;}.border-1::after{content:’’position：absolute；top：0；left：0；width: 200%;height:200%;//把宽高放大两倍，在缩放回去transform:scale(0.5);//需要改变变化起点默认是中间变化transform-origin：0 0 ；border:

2020-08-11 22:50:00 64

原创 mongodb的基本安装使用流程

官网下载mongoose安装包mongodb下载地址安装的时候注意一点在选择安装地址以后返回的时候一定一定一定要去掉勾选下载可视化工具（默认是选中把他去掉）我第一次下载的时候一路next下去结果就是一直安装不成功，说多都是泪安装好以后在环境变量里配置你的mongoose所在的bin目录环境，环境配置好，打开cmd 输入 mongodb --dbpath ‘创建的存放地址’ 在bin同级的data里就行，创建成功后进入存放地址输入mongo验证一下,如果有输出说明安装成功没有则失败以上.

2020-07-21 22:55:00 112

原创我对flex布局的理解

未使用flex布局的时候,对元素操作比较麻烦,就拿元素居中来说,需要写一大堆css相当难受,而使用flex几行css属性就能解决,而且对里面元素操作也是相当方便. 主轴相当于坐标系x轴，交叉轴相当于坐标系y认识flex之前首先得知道它的一些默认行为.默认子元素排列不换行, 子元素高100%,宽0%跟常规相反, 子元素主轴排列从左往右, 子元素的float属性失效等创建一个flex布局,首先选取一个容器添加个属性display:flex；这个容器支持属性:flex-directionfl.

2020-07-13 22:43:40 1630

weixin_47040974的博客