前端
Hope Fancy
前端程序员
展开
-
将数据导出为 CSV 格式
将数据导出为 CSV 格式原创 2022-06-28 14:21:49 · 677 阅读 · 0 评论 -
滑动到底部才允许关闭
滑动到底部才允许关闭原创 2022-06-28 14:10:26 · 138 阅读 · 0 评论 -
JS数组中的字段匹配成新的字符串数组
JS数组中的字段匹配成新的字符串数组此代码存在于特定的环境: 数组最大长度为4。此代码也不是最优,待优化。 const DEFAULT_A = [ { name: '1', content: [ { name: '1-1', code: '1-1', }, { name: '1-2', code: '1-2', }, ], },原创 2022-05-30 10:35:22 · 514 阅读 · 0 评论 -
JS 复制文字至剪贴板
const onCopy = () => { const copyDOM = document.getElementById('test-input-copy'); if (copyDOM && copyDOM?.innerHTML !== '') { const range = document.createRange(); // 创建一个 range window?.getSelection()?.removeAllRanges(); // 清除页面中已有的原创 2021-07-20 09:59:47 · 292 阅读 · 0 评论 -
js 数组排序
从小到大const a = [6, 7, 5, 9, 2, 1, 3, 4, 0, 8];a.sort((a, b) => a - b);// [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 12, 34, 84]从大到小a.sort((a, b) => b - a);// [84, 34, 12, 9, 8, 7, 6, 5, 4, 3, 2, 1, 0]原创 2021-06-08 10:38:17 · 100 阅读 · 0 评论 -
将 JSON 文件导入 Excel
首先将 JSON 文件导出转换为 html;在 Excel 中打开 html 文件,然后就会自动将 Excel 分行;因为我的 JSON 文件是一个字典(类似 Object),所以打开的 Excel 文件是两行,需要把这个变为列怎么办?两种方法:1) 选择性粘贴选择数据→复制(快捷键ctrl+c)→任意空白区域的单元格→右键(选择转置)→OK2) 选择区域→写公式(=TRANSPOSE(A1:B13))→同时按(ctrl+shift+enter)→ok(行转换成列,列转换成行是一样..原创 2021-04-23 18:53:09 · 5704 阅读 · 0 评论 -
Cube.js 的使用之安装(二)
终于可以开始安装 cube.js 了Cube.js 官方网站首先呢,要在自己的项目里安装 Cube.js 脚手架:npx cubejs-cli create <project name> -d <database type>database type 一般都是 postgres,project name 就比较随意,随便起个名字都可以,如:npx cubejs-cli create hello-world -d postgres这里值得注意的是,我使用了网上其他方原创 2021-04-16 15:44:44 · 1261 阅读 · 2 评论 -
Cube.js 的使用之安装 PostgreSQL(一)
最近在学习 cube.js,听大佬说,这个东西可以直击而那个前端查询数据库,越过后端,直接展示图表数据,我????后端难道要失业了????然后,就开始了学习之路:安装安装首先要安装 PostgreSQL:因为官方推荐使用 PostgreSQL,所以这里先将 PostgreSQL 的安装贴出来,作为学习的第一步。如果是 MAC 系统,那么安装有两种方法:使用 MAC 自带的安装软件工具:homebrew,安装这个软件后就可以使用 brew install xxxx安装对应的软件了1⃣️ 安装原创 2021-04-16 14:15:32 · 348 阅读 · 0 评论 -
Slider Range 分区跳过非法区域
今天碰到了一个需求,就是将 Slider Range 分为好几个区域块,当到达指定非法区域块时跳过该区域,两个 Slider Dot 同时跳到下一个区域。比如,Slider Range [0, 100],而value的有效值为 [0, 40], [60, 100], 那么非法区域当然就是 [41, 59] 啦,当我拉动 Slider 时,当从 40 之前往后拉,拉到 41 时,Slider 的两个 dot 将同时跳至 “60”,跳过非法区域。下面上代码:import React from 'react原创 2020-05-08 17:56:07 · 291 阅读 · 0 评论 -
React错误状态
今天使用React写组件的时候突然发现了一个报错:React does not recognize the marginTop prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase margintop instead...原创 2020-04-01 10:36:57 · 360 阅读 · 0 评论 -
手机点击Input外无法onBlur
突然发现html自带的 Input 在 Ios手机 和 iPad 上点击框外不会 onblur,软键盘不能回弹关闭,弄了好久,终于发现一个办法(无奈之举):在包裹着 input 外的最外层容器上添加 onClick 事件。 const onInputBlur = e => { if (e.target.tagName !== 'INPUT') { onBlur() ...原创 2020-03-13 17:27:36 · 851 阅读 · 0 评论 -
提交代码时不通过,报错信息:→ No partially staged files found...
今天提交代码时死活提交不上去,报错信息如下:→ No partially staged files found...于是检查代码,代码无误,后来搜索后发现是hooks检查不通过,说是因为代码风格不符合规范。于是手动输入 commit 命令:git commit -m "提交信息" --no-verify目的是跳过hooks校验直接提交,继续运行应该就可以正常提交了。链接为:转发自该链...原创 2019-12-27 10:40:32 · 2947 阅读 · 0 评论 -
字符串隐式转换为数字
Input中输入数字,但是获取到的是字符串,那么就可以用以下方式做转换:const value = “6677”;console.log(+value === 6677)打印出来的结果为true。可以采用这种方法去进行判断或其它操作,就简便一些。...原创 2019-10-16 15:40:14 · 995 阅读 · 0 评论 -
前端调试方法
该方法可用于Windows和微信小程序const test = () => { console.log(1);};window['test'] = test;调试时可直接在控制台使用window.test()进行调试,调试结果如下:该方法用于手机调试,可以对手机上打开的网页进行调试:在手机上打开此链接打开页面后如图所示点击信息,配置如下:...原创 2019-10-16 09:51:10 · 230 阅读 · 0 评论 -
Taro使用hook的情况下下拉刷新
Taro使用hook的情况下下拉刷新 onTouchEnd={(e) => { console.log(e.currentTarget); // 下拉刷新 e.currentTarget.offsetTop === 100 && Taro.showNavigationBarLoading() _member.getMember((result) =>...原创 2019-08-09 18:06:03 · 2237 阅读 · 0 评论 -
数组根据某字段首字母拼音排序并返回新的数组
原本的数组长这样:const data = [ { name: '测试数据1', sortName: '一个需要排序的数据' }, { name: '测试数据2', sortName: '二个需要排序的数据' }]拼音转换let PinYin = { "a": "\u554a\u963f\u9515", "ai": "\u57c3\u...原创 2019-08-20 10:15:32 · 4464 阅读 · 0 评论 -
清除对象中值为空的属性
清除对象中值为空的属性最近困扰我很久的一个问题,发送请求的时候如果 data 中某一数据为空,后端接收时去查询数据库返回的结果就会有问题,不传这个字段就没问题,所以就找到了这个办法://这个方法不会影响原来的对象,而是返回一个新对象function filterParams(obj) { var _newPar = {}; for (var key in obj) { //...原创 2019-08-20 11:09:43 · 4050 阅读 · 0 评论 -
Taro微信小程序授权登录流程
import Taro, { useState } from '@tarojs/taro'import { AtButton } from 'taro-ui';import { View } from '@tarojs/components'import './index.scss'const { _login }= require('../../utils/pageRequest/l...原创 2019-08-16 16:51:55 · 8144 阅读 · 0 评论 -
Taro使用时有时候刷新不及时
在使用Taro的时候所有的逻辑都写在同一个页面里,一层逻辑套一层逻辑,超过三层逻辑反应就会延迟,这时候就可以把逻辑返回页面单拎出来作为一个组件显示,逻辑内只用显示组件就可以了。...原创 2019-08-13 11:24:58 · 3633 阅读 · 0 评论 -
css控制文本折叠显示
文本折叠显示.compareDesc{ // 需要折叠的文本 font-size: 24px; color: #201E1E; display: -webkit-box; -webkit-box-orient:vertical; text-overflow: ellipsis; overflow:hidden;}.ellipsis{ -webkit-line-cl...原创 2019-08-27 17:33:21 · 1346 阅读 · 0 评论 -
HTML5 canvas鼠标画图
<!DOCTYPE htmlPUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <me...原创 2019-09-18 18:53:45 · 822 阅读 · 0 评论 -
使用Taro创建过程总结
设置淘宝镜像 npm config set registry http://registry.npm.taobao.org/还原淘宝镜像$ npm config set registry https://registry.npmjs.org/安装 cnpm$ npm install -g cnpm --registry=https://registry.npm.taobao.o...原创 2019-07-03 10:30:24 · 265 阅读 · 0 评论