- 博客(41)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 绝对的原创：echarts图表的tooltip也可以支持vue自定义组件，基于vue3.0
【代码】绝对的原创：echarts图表的tooltip也可以支持vue自定义组件，基于vue3.0。
2023-06-26 22:37:28
567
原创 使用Vue手写阉割版的五字棋(仅供参考思路和语法，本人不太会玩五子棋)
<template> <div class="wuziqi"> <div class="wuziqi-wrap" :class="gameOver && 'click-banned'"> <div class="wuziqi-row" v-for="(item, index) in list" :key="index"> <div class="wuziqi-cell"
2020-08-02 16:32:27
267
原创 element ui table组件的另类写法，支持固定多行表头
某个项目的特殊需求，首3行均是表头，且为冻结状态(即固定)，左边第1列也是固定状态废话少说，直接上vue源码<template> <div class="el-table-wrap"> <el-table :data="tableData" style="width: 100%" height="400" border> <el-table-column fixed width="150" align="center">
2020-07-23 02:44:49
1907
原创 提取当前域的Cookie数据,并存储为对象数组结构
涉及数组的map经典用法, 不一样的数组解构用法, 精简的动态属性对象用法提取当前域名的Cookie数据let result = document.cookie, 获取到的数据结构如下"_ga=GA1.2.508865395.1567870094; gr_user_id=06e98b97-09a2-4889-9b94-42f01869a72e; _gid=GA1.2.195245427.1593880848; Hm_lvt_93bbd335a208870aa1f296bcd6842e5e=159388
2020-07-05 02:05:24
527
1
原创 微博、腾讯视频(部分)提取器-- 后台Node.js篇
提取器：主要功能是将输入的微博视频地址转换成可下载的视频地址app.js全部代码const express = require("express");const http = require("http")const https = require("https");const path = require("path");var iconv = require("iconv-lite...
2020-02-13 21:15:05
2066
原创 分享一种比较“新型”的数组解构用法
假设有如下字符串, 现需要获取问号(?)前面部分字符串const address = "http://t.cn/A6PEMFTb?m=4468594668640673&u=2975378897"可使用数组解构形式, 看起来有点怪怪的let host = address;host = host.split('?');[host]= host; ...
2020-02-06 14:08:28
80
原创 vue&解构语法 实现新型冠状病毒肺炎的疫情实时动态的展示(一)
实现如下图红框里的效果数据结构如下 theadOption: { name: "省市", confirmNum: "确诊", death: "死亡", cured: "治愈" }HTML部分<div class="thead-option"> <div class="...
2020-01-29 18:31:57
1009
原创 Vue根据路由动态加载本地背景图片
项目需求：首页有一张中国地图，点击地图中不同的省份进入省份详情模式，此详情页面包含一张当前省份特定的背景图片，此页面的路由为/provinceId/9, 其中数字部分表示当前省份的ID.HTML部分代码<template> <div class="province-detail" :style="styleObject"> <h1></...
2020-01-26 00:12:29
1399
原创 vue cli 3.0 环境中启用 optional-chaining语法功能
安装依赖包npm install --save-dev @babel/plugin-proposal-optional-chaining修改 babel.config.js 文件module.exports = { presets: ['@vue/app'], plugins: [ [ 'import', { libraryName: 'vant',...
2020-01-15 00:19:18
4149
1
原创 Vue Cli 3.0跨域配置
vue.conf.js配置项devServer: { port: 8000, host: "127.0.0.1", proxy: { '/api': { target: 'http://127.0.0.1:3000', // 后台服务器地址 changeOrigin: true, ws: true, ...
2020-01-14 23:33:32
132
原创 数据处理业务场景分析
由对象组成的数组中，对象之键表示某个物料的编号，对象之值表示对应物料的单价，现在的业务需求是判断相同的物料的单价必须统一，如果不统一则给出提示并退出业务处理流程；let _arrItemPrice = [{'4323424':22}, {'4323424':22}, {'4323425':20}, {'4323428':22}, {'4423428':10}, {'4423428':10}...
2019-12-17 21:13:15
571
原创 【更多】动作组件的封装
适用场景在某些【操作】列里的选项过多时，一般都会启用“更多”功能import React from 'react'import { Menu, Dropdown } from 'tinper-bee';const { Item } = Menu;const style = { marginRight: 5, maxWidth: 100, overflow: 'hidden', dis...
2019-12-16 19:34:46
104
原创 React Hooks封装一个简单的锚点固钉的组件
JS部分import React, { useState, useEffect } from 'react';import { Icon } from 'tinper-bee'import './index.less'const AnchorLink = props => { const [isExpanded, setIsExpanded] = useState(true)...
2019-12-13 20:40:02
1194
原创 前端自己动手造后台，这样可以随时调试前端代码
+function func(data){data.forEach(item=>{if(item.children ) {level ++; func(item.children)}})}(temp1)
2019-12-12 20:24:35
262
原创 旁观者清，当局者迷，摘录部分同事的JS代码，并以旁观者的角度重写之！
别人的代码list.forEach(v => {//判断跨分页是否选中 if(this.state.selectedMap.has(v.headPoolId)){ v._checked = true }else{ v._checked = false }...
2019-12-04 19:45:41
104
原创 2. 尝试使用React Hooks重写【倒计时】组件（Hooks版本）
/* endTime: 目标时间，格式为时间戳endTimeUp: 倒计时结束的回调 */export const CountDown = ({ endTime, endTimeUp }) => { const [day, setDay] = useState(0) const [hour, setHour] = useState(0) const [minu...
2019-12-03 16:57:08
2150
1
原创 1. 尝试使用React Hooks重写【倒计时】组件（Class版本，未完待续......）
已经运行于项目中的组件代码import React, { Component } from 'react'import './index.less'export default class countDown extends Component { constructor(props) { super(props); this.state = { day: ...
2019-12-03 16:21:43
377
原创 在由对象组成的数组中，以属性1来分组，以属性2来排序，其中属性2是单元格合并的参数
现成的数据结构如下const arr = [{id: 1, itemName: "物料1", bagCode: "B1", bagName: "包1", rowSpan: 2},{id: 2, itemName: "物料2", bagCode: null, bagName: null},{id: 3, itemName: "物料3", bagCode: "B2", bagName: "包2...
2019-11-30 22:16:57
105
原创 三元表达式 | JSX | 回调函数
今天还是首次在JSX的点击事件中使用三元表达式，而且式子还是回调函数，特mark一下 <Button onClick={ handleGoback? ()=>handleGoback() : ()=>history.go(-1) } className="u-button-primary" >返回</Button>...
2019-11-28 18:14:40
784
原创 立贴专门用来收集后台返回的奇葩字段
有时一些后台返回的字段让人捉摸不定，比喻比喻表示 线上 线下 2种模式时，online: ‘线上’，然而downline: '线下'
2019-11-28 08:58:18
107
原创 想把项目截图并分享出来,但页面上有一些版权或相关隐私信息想去掉,怎么办?---自己动手、封装一个函数搞定它
/* 批量替换页面上的文本, el=接管页面元素范围 a=待替换的文本 b=替换后的文本 */ const changeText = (el,[a,b]) => { +function fn(nodes) { nodes && nodes.chil...
2019-11-27 01:27:20
139
原创 项目中遇到一个相对隐蔽的Bug小记
项目中的数据结构如下:const arr = [{id:1, supplierId:1000,supplierName:'供应商A',isInvited:1},{id:2, supplierId:1001,supplierName:'供应商B',isInvited:1},{id:3, supplierId:1000,supplierName:'供应商A',isInvited:1},{id...
2019-11-24 00:12:41
144
原创 在由对象组成的数组中,根据传入的属性名来去重(支持多重属性)
export const uniqByProps = (arr, ...props) => { const _arrTemp = []; if (Array.isArray(arr) && arr.every(item => Object.prototype.toString.call(item) === "[object Object]")) { ...
2019-11-21 21:14:33
130
原创 React 、箭头函数、bind、this小事记
今天在react项目中使用somefunc.bind(this)语法，但在somefunc方法内部，this却是undefined, 甚是郁闷！后来灵机一动，是不是箭头函数搞的鬼。立马将箭头函数变更为标准function函数，this立马指向了调用somefunc方法的实例环境。...
2019-11-20 20:59:12
406
原创 基于用友开源前端库、XLSX插件、React Hooks编写的文件导出组件
import React, { useState } from 'react';import { Button, Transfer } from 'tinper-bee'import PopDialog from 'components/Pop';import { Info } from 'utils'import moment from 'moment'import './index....
2019-11-20 11:35:07
715
原创 在 用友前端打包框架中启用Optional Chaining功能
1.npm install --save-dev @babel/plugin-proposal-optional-chaining 装包2. 在ucf.config.js全局配置文件中加入babel_plugins:["@babel/plugin-proposal-optional-chaining"]项3. 在VS Code的设置中, 配置 “javascript.validate.enab...
2019-11-20 00:24:05
567
原创 React Hooks 二次封装省市区街道4级联动组件
import React, { useState } from "react";import FormItemPro from 'components/FormItemPro';import { FormControl, Row, Col, Label, Button, Select, Loading, Modal} from "tinper-bee";import request f...
2019-11-18 02:06:38
1063
原创 关于在strict mode严格模式下无法使用arguments对象的替代方案
+function (params){ //匿名函数递归 params.forEach(item=>{ if(item.children && item.children.length) arguments.callee(item.children) el...
2019-11-16 10:33:00
2099
原创 React DevTools pre-release for Hooks | React Hooks可以在google浏览器控制台调试了(测试预览版)
具体参见React DevTools pre-release小技巧1. 导航至 ：console-> Components, 见左侧的小小的放大镜图标，在此处输入组件名可以搜索并定位组件2. 导致至：console-> Components, 见右侧(默认停靠位置)的小小多脚虫，点击它可以将Hooks变量映射到 浏览器的console控制台中去，方便调试！...
2019-11-09 17:19:51
509
原创 Object.keys & Object.entries使用上的一些小区别
假定有如下格式的数据，目的就是配合使用Select下拉框组件渲染一个key为属性名，可见文本为属性值的UI效果。// 文件类型 选择框枚举 const fileTypes = { techfile: '技术文件', busfile: '商务文件', otherfile: '其他文件', }Object.keys与map配合 的代...
2019-11-09 16:18:42
564
原创 JSX、!!、&&的那些事儿
某个项目中使用了如下代码 , 代码中的arr是动态计算所得，预期是有值时则输出值，无值时则无须渲染。render() { const arr = [1,2,3]; return ( <div className='test-apps'> { arr.length && <d...
2019-11-09 11:53:49
431
原创 手写验证器(Object.entries与some的经典应用)
假设已有如下数据const data = {evaluationType:'', techScoreType:'', openBidType: '' }// 基本验证配置 const isLowprice = data.evaluationType === 'lowprice'; const validator = { evaluationTy...
2019-11-08 21:00:38
372
1
原创 如何快速抓取对象数组中某个属性的集合？
如何快速抓取对象数组中某个属性的Key的集合？输入数据格式如下 ，要求抓取operations之所有Key的不重复的集合, 形如[‘free’,‘close’]等。const data = [ {id: 1, label: '全部', billStatus: 'alldata', number: 0, pId: 0 }, {id: 2, label: '待提交', billSt...
2019-11-07 17:58:01
1592
原创 在数组arr中 间隔插入元素el
某项目要求输出这样的格式(含逗号) 供应商A, 供应商B, 供应商C输入的数据为 arr = [‘供应商A’, ‘供应商B’, ‘供应商B’] ，试了几个现成的API, 好像都无法实现，索性自己封装了一个通用方法。调用： arrIntervalInsert(arr.map(item=><span style={{color:‘red’}}>{item}</span&...
2019-11-07 13:06:50
731
原创 浅谈前端表单中的增、删、改操作
[{id: 10, dr: 0, rowNo: 1, chapter: "第1章节",Content: "技术应答内容1"},{id: 15, dr: 0, rowNo: 2, chapter: "第3章节",Content: "技术应答内容3"},{id: 16, dr: 0, rowNo: 3, chapter: "第4章节",Content: "技术应答内容4"},{ }]1...
2019-10-29 16:27:20
498
原创 圆括号()的特别用处之一
假定有如下数据const arr = [ {id: 1, name:'张三', age:22, gender:'男' }, {id: 2, name:'李四', age:32, gender:'男' }, {id: 3, name:'王五', age:25, gender:'女' }, {id: 4, name:'刘六', age:27, gender:'男' },...
2019-10-29 09:32:22
515
视频提取器之后台Node.js代码
2020-02-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人