- 博客(66)
- 资源 (1)
- 收藏
- 关注
原创 WeakMap的用法和使用场景
WeakMap 对象是一组键/值对的集合,其中的键是弱引用的。其键必须是对象,而值可以是任意的,WeakMap 的 key 是不可枚举的。在 JavaScript 里,map API 可以 通过使其四个 API 方法共用两个数组(一个存放键,一个存放值)来实现。给这种 map 设置值时会同时将键和值添加到这两个数组的末尾。从而使得键和值的索引在两个数组中相对应。当从该 map 取值的时候,需要遍历所有的键,然后使用索引从存储值的数组中检索出相应的值。
2023-06-11 13:14:31
1073
原创 Object.is() 同值相等
同值相等的底层实现 Object.is()Object.is() 是 ES6抛出来的方法ES5并没有暴露js引擎的同值相等的方法。
2023-06-04 18:06:02
636
原创 使用extend写一个弹框组件
效果PopperInput.vue文件<template> <div class="popper-input" ref="popperInputRef" :style="{ top: `${top}px`, left: `${left}px` }" > <div class="arrow"></div> <div class="create-action create-tag" :style="{ .
2022-04-01 17:47:09
358
原创 css之切角效果
一个切角 <div class="main"> <div class="box">切角效果</div> </div> <style> .box{ width: 200px; height: 120px; padding: 10px; color: white; background: #58a; backgroun
2022-02-24 21:41:55
2743
原创 css菱形
<div class="main"> <img src="./1.png" alt=""></div><style> img{ width: 150px; clip-path: polygon(50% 0,100% 50%,50% 100%,0 50%); transition: 1s clip-path; } img:hover{ clip-path:pol.
2022-02-24 21:15:35
531
原创 css复杂的背景图案(网格、波点、棋盘)
使用css实现以下图案1、网格<div class="box box2"></div><style> .box { width: 200px; height: 100px; } .box2 { background: white; background-image: linear-gradient(90deg, rgba(200, 0, 0, .5) 50%, transparent 0)
2022-02-22 15:48:00
1035
原创 css条纹背景
1、横条纹<div class="box box2"></div><style> .box2 { background: linear-gradient(#fb3 25%, #58a 0, #58a 50%,#fb3 0, #fb3 75%, #58a 0); background-size: 30px 30px; } .box { width: 200px; height:
2022-02-22 11:15:08
288
原创 threejs正方体六面贴图
给正方体六面贴上不同纹理最终效果目录结构index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial
2021-09-05 20:19:34
1271
原创 webpack5打包图片并放到指定文件夹下
webpack5打包图片并放到指定文件夹下 module: { rules: [ { test: /\.(jpg|png|gif)$/, type: 'asset/resource', generator: { filename: 'imgs/[hash][ext][query]' }
2021-08-22 02:39:54
1391
1
原创 cmdline-tools component is missing
一、打开android studio的设置再次运行 flutter doctor 成功
2021-07-20 18:55:15
25769
18
原创 vue3.0中keep-alive失效
使用下面方式 <router-view v-slot="{ Component }"> <keep-alive :include="keep"> <component class="view" :is="Component" /> </keep-alive> </router-view>
2021-04-15 16:17:05
1948
原创 node创建web服务器
// 1. npm init -y// 2. npm i express -S// 3. 将打包后的dist放入node项目中// 4. const express = require('express')const app = express()app.use(express.static('./dist'))app.listen(80, () => { console.log('server runing at http://127.0.0.1')})// 5. nod
2021-03-27 19:04:26
62
原创 element图片上传
把action设成 #,http-request覆盖默认的上传行为,实现自定义上传 <el-upload action="#" list-type="picture-card" :show-file-list="true" :http-request="uploadImg" :on-remove="handleRemove" :file-list="editform.pictures" > <i class="el-icon-plus"&.
2021-02-21 20:55:01
158
原创 Toast is not defined
在html文件里使用vant的轻提示报错Toast('提示内容');改成vant.Toast('提示内容');
2021-02-02 14:58:11
1283
1
原创 egg项目部署到阿里云服务器上
1、登录阿里云服务器把7001号端口打开我用的是轻量应用服务器,这边直接开就好了云服务器在:更多 ----- 网络和安全组 ---- 安全组配置规则点击配置规则这边开放端口2、进入宝塔面板把7001号端口放行(不放行外部访问不了)3、可以在egg项目里写了点东西,一会搞完可以判断下接口开了没在router.js文件里加一条get请求'use strict';module.exports = app => { const { router, controller
2020-12-16 21:05:51
1545
1
原创 Koa2基本介绍,文件目录结构和基础代码
Koa2介绍koa2简介基于Node.js平台的web开发框架由Express原班人马打造框架名作用异步处理Expressweb框架回调函数Koaweb框架Generator + yieldKoa2web框架async/await依赖环境Node v7.6.0及以上Koa2特点洋葱模型的中间件支持async\awaitKoa2快速上手快速上手检查Node的环境node -v安装Koanpm init -ynpm instal
2020-10-30 11:00:07
1812
原创 CSS3的3D旋转
CSS3的3D旋转沿着y轴方向逆时针旋转这是图中旋转的图片代码 <style> *{ margin: 0; padding: 0; } body{ background: rgb(0, 13, 83); } @keyframes turn{ 0%{ -webkit-transfo
2020-10-14 17:29:11
441
原创 动态百度地图代码JS
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.3"></script> <div class="map" id="container" style="margin:30px 0px;width:1200px;height:270px;line-height:20px;font-size:14px;"> <script type="text/java...
2020-09-27 09:44:43
391
原创 $(this).get(0) 等于 $(this)[0]
$(this).get(0) 等于 $(this)[0]相当于把一个$(this) 当前jquery对象 转化为DOM 对象,以便于使用dom的一些方法。<input type="text" value="你好啊"><script> var input = $("input"); var input_0 = $("input")[0]; var input_get_0 = $("input").get(0); console.log
2020-09-21 11:19:02
1861
原创 $.extend和$.fn.extend的区别
$.extend()全称:jQuery.extend()扩展 jQuery 类本身,为jQuery类添加类方法用法:$.abc = function(){}菜鸟教程https://www.runoob.com/jquery/misc-extend.html$.fn.extend全称:jQuery.fn.extendjQuery.fn = jQuery.prototype,就是原型(每个对象也都有一个原型成员 prototype,通过 new 函数创建的对象会通过函数的 prototyp
2020-09-18 14:20:30
346
原创 获取地址栏中的数字部分
获取地址栏中的数字部分用的办法比较蠢如果地址栏中有多处数字,直接用的substr方法把前面多余的部分切掉,再提取数字部分,如果只有一个地方有数字就没必要截取了 var url= window.location.href; var strurl = url.substr(45) //截掉前面45个字符 console.log(strurl); var count = parseInt(strurl.replace(/[^0-9]/ig,""
2020-09-15 16:51:10
307
原创 在<head>标签中添加<title>元素的js代码
在 head 标签中添加 titlejs代码 //获取head元素 var head = document.head || document.getElementsByTagName('head')[0]; var title = document.createElement('title'); //创建title元素 title.innerHTML = 'csdn'; //设置标题内容 head.appendChild(title);
2020-09-15 16:41:37
1817
原创 element-UI的属性,事件,方法
总结在使用组件的方法时需要在对应的组件中加入 ref = “组件别名”在调用方法时直接使用 this.$refs.组件别名.方法名()注意:在element-UI中所有组件 都存在 属性 事件 和方法属性:直接写在对应的组件标签上,使用方法 :属性名 = 属性值 方式事件:直接使用vue绑定事件方式写在对应的组件标签上,使用方式 :事件名 = vue中事件处理函数方法: 1.在对应组件标签上使用 ref = “组件别名” ,2.通过使用this.$refs.组件别名.方法名() 进行调
2020-08-25 10:12:38
3635
原创 Git的使用(笔记)
Git的使用一、Git使用前配置在使用git前,需要告诉git你是谁,在向git仓库中提交时需要用到配置提交人姓名:git config --global user.name 提交人姓名配置提交人邮箱:git config --global user.email 提交人邮箱查看git配置信息:git config --list注意...
2020-07-31 03:38:17
110
原创 模板引擎(笔记了解)
一、模板引擎的基础概念1、模板引擎模板引擎是第三方模块让开发者以更加友好的方式拼接字符串,使项目代码更加清晰、更加易于维护2、art-template模板引擎在命令行工具中使用npm install art-template 命令进行下载使用const template = require(‘art-template’)引入模板引擎告诉模板引擎要拼接的数据和模板在哪 const html = template(‘模板路径’, 数据);3、art-template代码示例// 导入模板
2020-07-24 16:19:34
298
原创 mongoose验证(笔记)
mongoose验证在创建集合规则时,可以设置当前子段的验证规则,验证失败就输入插入失败常用的mongoose验证验证说明required: true必传字段minlength: 3字符串最小长度maxlength: 20字符串最大长度min: 2数值最小为2max:100数值最大为100enum:[‘html’ , ‘css’, ‘javascript’ , ‘node.js’]数据必须为框里的内容trim: true去除字符串两
2020-07-23 14:24:47
151
原创 MongoDB增删改查操作(笔记)
MongoDB增删改查操作1、创建集合创建集合分为两步,一是对集合设定规则,二是创建集合,创建mongoose.Schema构造函数的实例即可创建集合const mongoose = require('mongoose'); //一、创建用户集合规则 const userSchema = new mongoose.Schema({ name: { type: String, required: true, minlength: 2,
2020-07-23 14:13:15
185
原创 MongoDB数据库概述及环境搭建
MongoDB数据库概述及环境搭建一、数据库概述及环境搭建1、Mongoose第三方包使用Node.js操作MongoDB数据库需要依赖Node.js第三方包mongoose使用npm install mongoose命令下载2、启动MongoDB在命令行工具中运行net start MongoDB,否则MongoDB将无法连接3、连接数据库使用mongoose提供的connect方法即可连接数据库 const mongoose = require('mongoose');
2020-07-23 13:38:22
123
原创 Node开发(笔记)
一、Node开发概述1、Node是什么Node是一个基于Chrome V8引擎的JavaScript代码运行环境运行环境浏览器(软件)能够运行JavaScript代码,浏览器就是JavaScript代码的运行环境Node(软件)能够运行JavaScript代码,Node就是JavaScript代码的运行环境二、Node.js模块化开发1、Node.js中模块化开发规范Node.js规定一个JavaScript文件就是一个模块,模块内部定义的变量和函数默认情况下在外部无法得到模块内部可
2020-07-21 13:59:58
126
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人