float-left-优快云博客

原创 vue3性能优化

js被分成了多个，这样当我们用不到这个组件的时候，他就不会加载这部分js代码，让主包的js代码体积减小，缩短首次加载时白屏的时间。这样当我们使用npm run build打包后，dist文件夹中会是这个样子。那如果代码量大的话，这个js也会非常大，这样当我们再次build打包后可以看到。所有js代码会被压缩到一个js中，当我们加载组件使用异步加载的方式。就会导致首次加载白屏时间非常长。

2024-01-15 10:12:26 515

React 面试题1、setState 是异步还是同步？合成事件中是异步钩子函数中的是异步原生事件中是同步setTimeout中是同步相关链接：你真的理解setState吗？2、聊聊 react@16.4 + 的生命周期相关连接： React 生命周期我对 React v16.4 生命周期的理解3、useEffect(fn, []) 和 componentDidMount 有什么差异？useEffect 会捕获 props 和 state。所以即便在回调函数里，你拿到的还是初始

2021-01-12 16:24:29 278

原创 vue2-vue3

来，先介绍一下Vue的响应式系统Vue为MVVM框架，当数据模型data变化时，页面视图会得到响应更新，其原理对data的getter/setter方法进行拦截（Object.defineProperty或者Proxy），利用发布订阅的设计模式，在getter方法中进行订阅，在setter方法中发布通知，让所有订阅者完成响应。在响应式系统中，Vue会为数据模型data的每一个属性新建一个订阅中心作为发布者，而监听器watch、计算属性computed、视图渲染template/render三个角色同时作

2021-01-12 16:23:51 432

原创 React

起步创建项目npx create-react-app <项目名>运行项目npm startreact使用jsx语法，类似js+XML语法，可以在js中写Xml代码遇到<>，按照XML语法解析，遇到{}按照js语法解析遇到（）表示如果存在标签结构<xml代码>，并且需要换行，则将这段代码写在小括号内，小括号代表允许多段+换行react项目遵循组件开发原则，页面都是由一个个组件组合而成，优点是低耦合性组件1.创建组件创建后缀为.jsx的文件，好处是

2020-12-02 17:58:47 292

原创 uniapp

const pages = getCurrentPages(); //获取页面栈 const beforePage = pages[pages.length - 2]; //前一个页面 beforePage.$vm.getInfo() //h5端不加`$vm`，app和小程序要加

2020-11-27 15:47:14 1221

原创一个简单的防抖

let timeout = -1 //写在外边 support(e) { this.sup = !this.sup clearTimeout(timeout) timeout = setTimeout(() => { console.log(this.sup) //这里边写需要防抖的内容 clearTimeout(timeout) }, 900) },

2020-11-12 14:07:59 334

原创 Mongoose操作数据库

var mongoose = require('mongoose');//引入mongoosemongoose.connect('mongodb://localhost/test',{ useUnifiedTopology: true,useNewUrlParser: true });//设置数据库路径 //连接数据库var db = mongoose.connection;db.on(...

2019-12-27 11:05:03 187

原创 Promise

什么时候需要使用Promise? 大量的异步操作,需要按照一定顺序执行的时候,如果使用多个回调函数,会造成回调地狱所以通过Promise对象解决回调地狱如何创建一个Promise对象,如何使用?1.创建一个函数,在函数内return一个promise对象Promise对象有两个形参,这两个形参说到底就是用来return一些数据,其中resolve用在成功回调,reject用在失败...

2019-12-26 10:08:29 213

原创 WebPack打包工具

起步创建项目,在项目文件夹中cmd1.初始化项目npm init2.本地安装webpacknpm install --save-dev webpacknpm install --save-dev webpack-cli3.创一个用于打包的文件夹dist此时文件夹应该是这样的创建webpack.config.js4.在文件根目录创建webpack.config.js在此...

2019-12-19 17:46:47 186

原创让input框只能写数字

2019-10-21 17:11:47 185

原创初识React

起步全局安装reactcmd里边npm install -g create-react-app每次创建项目create-react-app 项目名cd 项目名将路径进入到项目文件夹npm start启动项目,自动打开浏览器进入 localhost:3000构建项目的一些基本配置App.js我们创建项目以后App.js打开是这样的import React from ...

2019-07-30 18:04:53 262

原创 jQuery中ajax post方法

$.post(‘url路径’,{post要发送的数据},function(res){console.log(res)回调函数})

2019-07-25 15:01:32 423

原创 express+MongoDB+robo对接口数据进行增删改查

准备工作在robo中创建自己的接口点击create点击save保存之后双击你建好的接口进入在new Connection上右键点击create Database创建数据库,起名字在你新创建的数据库里有一个Collections文件夹,右键他点击 Create Collections创建一个新接口建好之后是这样的之后创建express项目express-enpm insta...

2019-07-25 14:59:46 383

原创 MongoDB安装加载

1.下载上mongodb官网https://www.mongodb.com/download-center/community下载自己电脑对应的版本安装之后我放到了D盘，我D盘空间大二；开其服务与关闭服务创建数据库目录D:\data ，接下来打开cmd 命令窗口，切换到D:\bin目录执行如下命令 mongod --dbpath D:\data 这时命令行窗口会打...

2019-07-24 16:07:56 146

原创 express如何上传文件

首先html页面写表单那一套<form action="/users/upload" method="post" enctype="multipart/form-data"> <input type="file" name='pic'> <input type="submit" value="上传"></form>这里有几点要...

2019-07-24 15:52:28 666

原创 express框架知识点,随时更新

express框架要用post方法的时候,首先需要引入body-parsernpm install body-parser然后在app.js中上边加入var bodyParser = require('body-parser')在下边app.use()专区里加入app.use(bodyParser.json({type:'text/plain'}))//目的是为了让发送过来的数据转换...

2019-07-24 14:38:47 191

原创原生nodejs如何上传图片

var http=require('http')var fs=require('fs')// formidable是nodejs中用来上传图片的模块var formidable=require('formidable')// path是路径模块var path=require('path')http.createServer(function(req,res){ // 如果请求的方...

2019-07-23 15:05:09 860

原创 Node.js基础

肯定写的比较乱,以后慢慢整理吧Node.js是一个基于 Chrome V8引擎的JavaScript 运行环境单线程, 事件驱动非阻塞式I/O的模型,使其轻量又高效Node.js中的模块1.http模块可以借助http模块,快速搭建一个迷你webserver代码:var http = require("http");http.createServer(function(req...

2019-07-19 15:11:09 171

原创 mintUI中messagebox的用法

api写的不详细,自己写一个以后拿来套用吧this.$messagebox({ title: '提示', message: '您是否要删除?', showCancelButton: true, confirmButtonText:"删除", cancelButtonText:"取消" }).then(action =&...

2019-07-16 13:16:55 298

原创封装vue-axios

0 npm install axios`1.在src目录中新建一个目录文件夹 api2 在api文件夹中新建index.js 和api.js这些名字都是自己取的.3 在index.js中首先引入axios import axios from 'axios'设置axios的默认路径,之后所有路径都在这个基础上添加后缀 axios.defaults.baseURL = 'http...

2019-07-08 14:33:46 120

原创 js面向对象||this指向||call和apply方法的使用和区别

首先内置对象有比如String Array 等等String 的属性有 length方法有 substring slice concat 等等接下来我们就可以利用prototype方法来给String 来创建属性和方法比如说:String.prototype.big="这是一条自创属性"这条是说我给所有的String都添加了一个属性叫做big 属性的内容是"这是一条自创属性...

2019-06-06 15:13:00 211

原创当拖拽事件mouseup失效时

有时候会出现拖拽mouseup失效,某div一直跟着鼠标甩不掉,mouseup中的$(".box").mousemove=null无效这个时候把mouseup事件中改为:$(document).mouseup(function (e) { $(this).unbind('mousemove'); });用unbind,移除此元素的事件括号里不填就是移除所有事件我填了mou...

2019-05-28 20:25:05 4032

原创冒泡排序

var arr= [3,5,11,7,4,8]; for (var i=0;i<arr.length;i++) { for (var j=i+1;j<arr.length;j++) { if(arr[i]>arr[j]){ var a = arr[j]; arr[j] = arr[i]; arr[i] = a; } } }

2019-05-07 14:22:07 121

原创 jQuery中offset方法

在js中获取元素实际宽度的方法是:div.offsetWidth; 获取元素距顶部的实际距离的方法是:div.offsetTop; jq当中如果我要获取元素实际宽度我不能这样写$(".div").offsetWidth这样写获取不到我需要$(".div").get(0).offsetWidth或者...

2019-04-25 12:12:37 1852

原创 JavaScript中按enter键，禁止换行

按enter键，禁止换行if (event.which == 13) {event.cancelBubble=true;event.preventDefault();event.stopPropagation();}

2019-04-19 15:54:57 3310

原创 jq怎样让滚动条停留在底部

('#content').scrollTop( (‘#content’)[0].scrollHeight );原理:

2019-04-18 16:09:38 1015

原创 js选项卡思路

思路:5个li对应5个div.当我点击一个 li 的时候,将所有的div隐藏将所有的li的样式统一之后当我触发点击事件时将我电机的这个li的样式改变改变颜色等通过**.index**将与li对应的div解除隐藏,就可实现最基础的选项卡效果.<script>var item=document.getElementsByClassName("item");var box...

2019-04-16 19:29:33 258

原创封装Cookie

创建Cookie:function setCookie(**name,value,iday**){ var oDate=new Date() oDate.setDate(oDate.getDate()+idate) document.cookie=name+"="+value+"; expires="+oDate }第一步创建函数,有三个形参,分别代表了cookie的**名字,值...

2019-04-16 19:12:50 353

原创自定义右键菜单

思路:1.右键菜单的样式是自己创建的.2.要将浏览器本身的右键内容移除运用 return false3.在平常时自制的右键菜单处于隐藏状态4.当右键单击事件触发时:(1)解除隐藏;(2)定位鼠标所在位置(3)将自制右键菜单的定位修改为鼠标的定位5. 当左键单击事件触发时:使右键菜单再次进入隐藏状态代码html css:js:...

2019-04-16 18:24:52 385

weixin_44900249的博客