- 博客(49)
- 收藏
- 关注
RSS订阅原创 react学习-useReducer
在hooks中，可以为函数式组件提供类似Redux的功能，类似于vuex都是提供状态管理的，官方提供两种state管理：useState，useReducer。2.如果你的state变化很复杂，经常一个操作需要修改很多state。3.如果你的应用比较大，希望UI和业务能够分开维护是时候。1.如果说你的state是一个数组或者对象。案例2：state为复杂对象时。理解为阉割版的redux。
2024-06-10 11:32:56
285
原创 react学习-高阶组件
react高阶组件是一个函数，接收一个组件作为参数，返回一个新的组件，可以用来进行组件封装，将一些公共逻辑提取到高阶组件内部。以下案例为利用高阶组件来增强props。
2024-06-07 23:17:07
272
原创 vue+elementUI实现树形穿梭框
思路二：利用elementUI的filter API对选中节点进行筛选，左侧筛选出未选中的，右侧筛选出选中的，用的还是同一棵树，用一个属性来区分是否选择，好处是子节点选中，父节点会跟随保存，不用重新构建树结构。将左侧选中的节点移动到右侧，还要保持树结构，意味着移动子节点，需要把该子节点对应的父节点甚至父节点的父节点一并移到右侧形成一个新的树结构，树结构的层级和原来的树保持一致，只是右侧展示的子节点为选中的子节点，filter API用法。
2024-03-20 15:21:38
4306
3
原创 前端使用url实现文件下载
通过后端返回的文件的服务器地址，实现文件的点击下载，而不是直接打开文件（浏览器支持预览的文件，访问地址时会直接打开，不支持预览的文件才会下载），以下方法就会直接打开，而不会在浏览器打开预览
2023-10-16 10:32:18
1893
原创 Webpack 初识
1.简介Webpack是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源。官网地址：https://webpack.docschina.org/从上图可以看出，Webpack可以将多种静态资源js，css，less转换为一个静态文件，减少页面请求。2.主要配置介绍本质上，webpack是一个用于现代javascript应用程序的静态模块打包工具。当webpack处理应用程序时，他会在内部从一个或多个入口点构建一个依赖图，然后将你项目中
2022-05-12 23:51:45
226
原创 RESTful Web API设计
1.良好的API设计应旨在支持：（1）平台独立性。不管API内部实现方式如何，任何客户端都应该能调用该API。这就需要使用标准协议并非创建一种机制，使客户端和web服务能够就交换数据的格式达成一致。（2）服务演变。Web API应能在不影响客户端应用程序的使用情况下改进和添加功能。随着API的发展，现在客户端应用程序应可继续运行而无需进行任何修改。所有功能应该是可发现的，使客户端应用程序能够充分利用它。2.什么是REST？REST是一种基于超媒体构建分布式系统的架构风格。一种接口设计模式。REST独
2022-05-12 23:13:13
354
原创 flex布局，子元素撑开父元素
1.将父元素设置为display:flex时，子元素不设高度时（宽度需要设置）会默认撑开满父元素高度：2.经典两栏布局如果child1有子元素的话，并且子元素宽度过大，会撑开child1，将child2的宽度挤压，如下：解决办法将child1的宽度设置为：width:0;...
2022-04-03 18:58:06
10024
原创 js中使用toFixed()时的精度问题
js中使用toFixed()时的精度问题在js中使用toFixed()进行小数点保存时需要注意的问题，示例如下：由上图可以看出，在通过toFixed(2)获取到的小数实质为字符串，在乘100时进行了转换，而由于浮点数精度问题，造成了计算结果不准确，改进方法如下：先乘100进行计算后在进行取小数点后两位操作。以下多做了几次乘法实例，更加可以看出精度问题导致的计算不准确：参考：IEEE二进制浮点数算术标准（IEEE 754）...
2022-03-22 16:50:55
1777
原创 js各种数据类型与布尔值之间的转换
js各种数据类型与布尔值之间的转换数据类型转为true的值转为false的值BooleantruefalseString非空字符串空字符串Number非零数值(包括无穷值)0，NANObject任意对象nullUndefinedN/A(不存在)undefined注：摘自《JavaScript高级程序设计》...
2022-03-02 16:37:33
500
原创 forEach 跳出循环
forEach跳出循环foreach不能使用return或者break跳出循环，因为foreach的参数为回调函数，会遍历执行多个回调函数，return会直接跳出执行的当前的回调函数，其他的回调函数会继续执行，而用break会直接报错，最好的办法是抛出异常，捕获到异常终止遍历1.return var arr = [1, 2, 3, 4, 5]; arr.forEach((item) => { if (item === 2) { return;
2021-10-15 11:42:43
1975
原创 three.js几何体沿特定轨迹运动
three.js几何体沿特定轨迹运动<!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-scale=1.0"
2021-10-15 11:07:39
494
原创 vue + ant design of vue表单校验
vue + ant design of vue表单校验实现方法总结表单示例为FormModel表单1.通过rules绑定，不需要自定义，适用于一般校验html<a-form-model ref="ruleForm" :label-col="{ span: 6 }" :wrapper-col="{ span: 15 }" :model="formData" :rules="rules" > <a-form-model-item la
2021-10-15 10:37:04
802
原创 three.js 纹理贴图
three.js 纹理贴图1.单个图片通过纹理贴图加载器TextureLoader的load()方法加载一张图片可以返回一个纹理对象Texture，纹理对象Texture可以作为模型材质颜色贴图.map属性的值。材质的颜色贴图属性.map设置后，模型会从纹理贴图上采集像素值，这时候一般来说不需要再设置材质颜色.color。.map贴图之所以称之为颜色贴图就是因为网格模型会获得颜色贴图的颜色值RGB。// 纹理贴图映射到一个矩形平面上var geometry = new THREE.PlaneGeo
2021-10-13 17:35:23
1104
原创 vue 可搜索树组件封装
vue 数组件封装组件代码：<template> <div class="content"> <div class="tree-item" v-for="(item, index) in data" :key="index"> <div class="item" :class="{ active: choice === item.id, }" :style="{ 'padding-left': padLeft
2021-10-12 11:37:40
282
原创 axios 利用CancelToken中断请求
axios 利用CancelToken中断请求1.发送请求处 一般我们将axois请求封装为request.js文件并暴露出接口以便外部使用。在外部调用的过程中，如遇到不符合要求或需要新增的config参数是允许覆盖和新增的，编写如下：import axios from 'axios';import request from '@/utils/request';//这里采用传递executor函数到CancelToken的构造函数来创建cancel tokenconst CancelToke
2021-10-12 11:18:02
957
原创 d3+svg画图基础应用
d3+svg画图基础应用1.svg1.1 简介SVG，是一种用于描述二维的可缩放矢量图形，基于XML的标记语言，像JPEG和JPG不同，SVG格式提供的是矢量图，这意味着它的图像能够被无限放大而不失真和降低质量，并且可以方便的修改内容。1.2 常用标签和属性svg：SVG容器；defs：SVG允许定义以后需要重复使用的图形元素，建议所有需要再次使用的元素定义在defs元素里面；可以增强SVG内容的易读性和可访问性defs元素中定义的图形元素不会直接呈现，可以在视口的任意地方利用use标签呈现；
2021-10-11 16:36:20
1779
原创 Three.js基础-简单几何体
Three.js简单应用Three.js是基于原生WebGL封装运行的三维引擎，在所有WebGL引擎中，Three.js是国内文资料最多、使用最广泛的三维引擎。相关链接：github链接：https://github.com/mrdoob/three.jsThree.js官网：https://threejs.org/以下为简单几何体实现：主要步骤：1.创建场景对象2.创建几何对象3.创建网格模型对象3.创建材质对象4.将材质对象和几个对象添加到网格模型对象5.将网格模型对象添加到场景
2021-10-11 16:17:55
178
原创 Google Chrome开发插件，在特定网页执行js脚本
Chrome开发插件，在特定网页执行js脚本当想在某些网页网页之中执行自己写的js脚本文件，而又无法直接嵌入别人的源码之中怎么办？可以利用Chrome的插件功能，自己开发配置一款插件，使其浏览器每次打开特定页面时，执行特定的js脚本。具体步骤如下：1.创建一个新的文件夹2.在文件夹中创建配置文件，名称固定为：manifest.json可以利用记事本创建，后缀名改为.json,文件内容如下：字段解释：manifes_version：声明是我们使用的版本。name和description：分别
2021-03-12 16:52:05
5562
原创 Angular cli搭建项目
Angular cli搭建项目1.安装node.js（最好是最新稳定版）2.安装完node.js后会自动安装上npm，但npm通常下载文件资源较慢，建议下载安装cnmp：在命令行直接输入： npm install -g cnpm --registry=https://registry.npm.taobao.org3.全局安装Angular cli脚手架在命令行直接输入npm install -g @angular/cli 或者cnpm install -g @angular/cli4
2020-11-03 11:46:16
539
原创 React启动服务时报错
React启动服务（npm start）时报错错误详情：有的说是端口问题，有的说是环境变量的问题，如果那些方法都没有解决的话就有可能是下面这种问题：react-script版本问题：在package.json文件内部将版本降级，安装2.几的版本：安装成功后重新启动服务：npm start最后服务启动成功...
2020-10-20 12:35:40
449
原创 Vue（自定义事件+组件）实现简易表单
Vue组件实现简易表单描述：封装Vue组件，组件可以复用，只需改变组件内容，通过遍历vue实例对象内的数据内容，将数据放进组件，并在组件内部通过$emit()将需要操作的事件以及参数传递出去，由父组件接收后再利用vue实例里的函数进行相应操作，注意这里不要直接在组件内部调用vue实例的函数，必须要通过父组件。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <
2020-09-28 13:43:07
372
DataV地图资源数据包
2023-08-24
monaco-editor实现的sql编辑器
2023-02-22
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人