- 博客(17)
- 收藏
- 关注
RSS订阅原创 瀑布流布局
4、再通过这个数组去查看那一列高度最低，完了吧第二行的第一个卡片放到这个最低的列，以此往复即可。3、根据这个数据展示开始的列表，每个卡片的高度不同（后端数据返回），展示开始的一行。// 通常配合上拉刷新一起使用（可见另一篇文章，交叉监听器的使用）1、获取要展示的dom元素，根据dom去计算当前页面能展示几列数据。2、通过这个几列，将一个数组分成这个长度，数组的每一项代表每一列。//卡片宽度260px,左右间距6px,上下间距18px。// 类似于PC抖音首页布局。
2023-12-25 15:43:00
368
原创 常用链接收藏
常用链接收藏清缓存chrome://net-internals/#sockets数组常用方法 （es4,es5,es6）https://blog.csdn.net/weixin_57983561/article/details/117232638js根据数组中对象的多个属性值进行排序https://www.cnblogs.com/kerin/p/15433435.htmlhttps://blog.csdn.net/tangkthh/article/details/93750442...
2022-03-30 10:35:04
261
转载 object-to-querystring
query参数整理方法js方法示例结果object-to-querystringjs方法const objectToQueryString = queryParameters => {return queryParameters? Object.entries(queryParameters).reduce((queryString, [key, val], index) => {const symbol = queryString.length === 0 ? ‘?’ : ‘&
2022-03-18 15:27:16
429
原创 useContext的用法
useContext的用法useContext基本使用可以分为固定的三步第一步第二步第三步useContext基本使用可以分为固定的三步第一步根组件导入并调用createContext方法，得到Context对象，并导出import React, { createContext } from ‘react’;export const Context = createContext();第二步在根组件中使用 Context.Provider 组件包裹需要接收数据的后代组件，并通过 value 属
2022-03-01 14:13:07
2646
1
原创 Git SSH配置
Git SSH配置1、检查系统是否已存在SSH密钥2、生成新的SSH密钥显示公钥复制公钥Windows:Mac:配置测试1、检查系统是否已存在SSH密钥cat ~/.ssh/id_rsa.pub如果看到以ssh-rsa或开头的长字符串ssh-dsa，则可以跳过下一步的ssh-keygen步骤2、生成新的SSH密钥ssh-keygen -t rsa -C ‘xxx@xxx.com’ 然后一路回车(-C 参数是你的邮箱地址)显示公钥cat ~/.ssh/id_rsa.pub复制公钥Window
2021-12-28 17:25:40
767
原创 upload 图片上传
图片上传OSS上传另一种方法上传OSS上传import { Upload, Button, Icon } from ‘@alifd/next’;<Form.Item label=“操作说明图片”></Form.Item> // 图片上传const beforeUpload = (file, options) => {if (file.size > 2048000) {Message.error(‘文件不能大于2M’);return false;
2021-12-24 15:53:20
523
原创 select下拉框事件操作
select下拉框事件操作想要在select下拉框里面进行选项列的删除等操作，但是下拉框的事件是分装的，所以需要进行阻止时间冒泡，如下：e.stopPropagation()；itemRender方法是select的一个API，通过itemRender可以实现：const itemRender = item => {return ({item.label}<Icon type=“close” size=‘xxs’onClick={(e) => {e.stopPropa
2021-12-10 16:02:05
1254
原创 点击按钮禁用倒计时
点击按钮禁用倒计时类组件方式函数组件方式类组件方式state = {// 查询按钮禁用倒计时searchButtonCountDown: 0,};startSearchButtonCountDown = () => {this.setState({ searchButtonCountDown: 10 });const timer = setInterval(() => {const { searchButtonCountDown } = this.state;if (sear
2021-12-06 14:42:42
580
转载 倒计时（三种场景）
倒计时自动倒计时（单次）自动倒计时（循环）倒计时按钮（验证码获取）自动倒计时（单次）import React, { useEffect, useState } from ‘react’;function Demo() {let [ number, setNumber ] = useState(10)useEffect(()=>{let setInt = self.setInterval(()=>{if(number <= 0){clearInterval(setInt)a
2021-10-29 10:35:01
523
原创 app上划分页加载
app上划分页加载1、getScrollTotal封装2、getScrollData封装3、数据请求4、ScrollContent使用5、ScrollContent封装1、getScrollTotal封装export function getScrollTotal(total, pageSize, pageNum, getInfo, setEnd, data?) {if (total && Math.ceil(total / pageSize) >= pageNum) {if
2021-07-30 14:58:38
278
原创 常用方法封装
常用方法封装1、获取cookie2、是否是ios环境3、输入框保留小数4、 获取正整数数据（非四舍五入）5、数据判断是否为空，为空显示-6、是否为非空数组7、唯一标识1、获取cookieexport function getCookie(allCookies, name) {const cookies = allCookies.split(’;’);let cookie;cookies.map((v) => {const value = v.trim();if (value.indexO
2021-07-30 14:45:33
132
原创 React路由传参与参数获取
React路由传参？路由传参参数获取方法封装getSearchParams接收页面参数获取？路由传参history.push(/cropManagement/SchemeDetails?solutions=${solutions}&schemeId=${schemeId});参数获取方法封装getSearchParams封装出去导出，使用时直接引入，（utils/index）页面export function getSearchParams(query) {const queryStr
2021-07-28 10:15:01
606
转载 简单的水印
@TOC简单的水印简单的水印应用场景需要在网站中，大致背景中写入个人工号的水印，防止员工截图放置公司数据安装方法npm i watermark-simple调用方法从“水印简单”导入{ WM } ; // WM功能类似一个DIV，可以输入的className，样式的onClick等< WM文本= { “望明” }颜色= { “#ebebeb” } > {道具。儿童} < / / WM >文件text（string）：写入需要在当前dom中的水印文本fontS
2021-04-15 15:46:13
714
原创 lint标准问题
@[TOC]lint问题lint标准打开Vs Code Setting，在搜索框中输入’format on save’，同时勾选相关选项，便可在文件保存编辑后，自动回复lint问题，即，自动格式化代码；
2021-04-01 18:51:41
114
原创 Vs Code常用的插件
@TOCVs Code常用的插件1、Beautify css/sass/scss/less (2.3.3)css/sass/scss/less的格式化美化CSS，SASS和更少的代码（Visual Studio Code的扩展名）如果您美化其他语言，则代码/文本将被美化为Visual Studio Code的默认格式化程序。2、Chinese (Simplified) Language Pack for Visual Studio Codevs code的简体中文的语言包3、Code Sp
2021-03-25 16:29:28
1252
原创 CSS calc() 函数
CSS calc() 函数width: calc(100% - 100px);calc()是一个css运算函数，上述表示在继承的父级100%宽度的
2021-03-22 14:30:47
4793
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人