前端开发
js,ts及其他前端知识
-雾里-
凡是过往 ,皆为序章
展开
-
【vue】- 简易版筛选组件可展开/收起
仅做记录,未整理格式css部分未完全,每个筛选条件为固定宽度。原创 2023-06-29 11:23:14 · 1307 阅读 · 0 评论 -
前端知识点整合
文章目录一、css1.相对定位和绝对定位(2022/4/14)2.背景图片3.限制文本长度显示省略号4.opacity透明度覆盖子元素5.js修改css变量二、js1.js数据类型(2022/4/14)2.== 与===的区别(2022/4/14)3.深拷贝和浅拷贝(2022/4/14)4.防抖和节流(2022/4/14)5.词法作用域(Lexical Scopes)(2022/4/14)6.闭包与内存泄漏(2022/4/14)6.1闭包的形成与作用6.2内存泄漏一、css1.相对定位和绝对定位(20原创 2022-04-14 21:12:26 · 392 阅读 · 0 评论 -
常用Es6(5之后)的正确打开方式
文章目录1.取值-解构赋值2.扩展运算符和Set3.includes4.精确搜索5.可选链操作符6.空值合并运算符7.异步函数8.三目运算符9.扁平化数据10.for of1.取值-解构赋值const obj = { a:1, b:2, c:3, d:4, e:5,}//es5const a = obj.a;const f = obj.a + obj.d;//es6const {a,b,c,d,e} = obj;const f = a + d;原创 2022-04-01 15:13:00 · 2234 阅读 · 0 评论 -
【React】-子组件暴露类实例方法
//子组件暴露整个类实例import { Component } from "react";import { View, Text, Image } from "@tarojs/components";class Child extends Component { constructor() { super(); } componentDidMount() { this.props.refs(this) } say(){ console.log('11原创 2022-03-23 11:44:18 · 1548 阅读 · 0 评论 -
svg无法占满屏幕
问题描述:使用svg作为背景时,发现容器可以占满,但svg无法铺满整个容器解决方案:打开svg图片,然后在svg标签上面加上属性:preserveAspectRatio="none meet";<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 375 250" preserveAspectRatio="none meet">...原创 2021-10-26 09:44:34 · 1864 阅读 · 0 评论 -
JS题目记录
JS题目记录文章目录JS题目记录一、字符串转驼峰模式一、字符串转驼峰模式如:’wo-shi-tuo-feng‘转成‘woShiTuoFeng’思路:1.根据-划分字符串2.遍历单词数组,转换单词首字母(注意为空去除)3.拼接新的字符串function convertToCamelCase(str) { // 去除中划线分隔符获取单词数组 var strArr = str.split('-'); // 如果第一个为空,则去掉 if(strArr[0] ===原创 2021-10-21 10:50:45 · 75 阅读 · 0 评论 -
npm install报错no template named ‘remove_cv_t’ in namespace ‘std’; did you mean ‘remove_cv’? - Stack O
node.js - error: no template named ‘remove_cv_t’ in namespace ‘std’; did you mean ‘remove_cv’? - Stack Overflow使用npm install或yarn install时一直报错,翻了好久百度才发现是依赖中 node-sass 的版本不支持 Node.js16 ,只能在 15 及以下的环境下运行,通过 node 版本控制器 n 对使用的 node 进行降级就可以正常安装 node-sass ,安装原创 2021-10-01 14:36:01 · 4762 阅读 · 0 评论 -
react-字符串转dom元素
<div dangerouslySetInnerHTML={{__html:str}}></div>原创 2021-09-13 16:10:13 · 1358 阅读 · 0 评论 -
css-数量不定的盒子换行
1.实现效果2.思路由于不确定一行有几个标签,因此不能采用:nth-child(3n + 3) { margin-right: 10px; }实现代码参考:.box{ margin: 10px 5px 5px 10px; .tag{ margin-right: 5px; margin-bottom: 5px; } :nth-last-child(1){ margin-right: 0px !import原创 2021-06-25 11:39:43 · 454 阅读 · 0 评论 -
js—数组过滤及树形数组的一些应用
文章目录一、数组过滤1.filter字符串包含某个字符2.forEach_indexOf数组去重(id值相同)3.双重for循环_splice数组去重(key相同)4.for_indexOf数组去重二、树形数组1.默认选中_返回树形中所有被选中的id数组2.被取消且原本为选中的提示:以下是在之前写项目的时候应用过的一些小栗子,仅供参考一、数组过滤1.filter字符串包含某个字符selectedRowKeys.filter((item: any) => item.includes('.ps.原创 2021-06-11 11:03:15 · 522 阅读 · 0 评论 -
【React】- Antd tree树形组件前、后缀图标
文章目录一、antd官网二、代码1.实现效果2.读入数据一、antd官网antd官网树形控件API二、代码1.实现效果2.读入数据代码如下(示例):import { Tree, Switch } from 'antd';//引入//需要的图标const baseIcon = <SVGIcon iconClass={'baseIcon'} width={14} height={14}></SVGIcon>;const departIcon = <SVGI原创 2021-06-11 10:25:52 · 4736 阅读 · 1 评论 -
React-全屏、取消全屏及自适应防抖处理
文章目录前言一、html部分二、ts/js1.全屏事件2.取消全屏及防抖处理前言有些时候,我们需要在浏览器窗口发生变化的时候,动态的执行一些操作,比如做全屏,取消全屏及自适应页面时的适配。一、html部分//需要全屏的盒子<div className={styles.box} id='box'> {screens}</div>//全屏事件<div className={styles.btn} onClick={() => ful.原创 2021-06-01 09:42:25 · 1166 阅读 · 0 评论 -
Vue环境搭建
1.安装node,npm2.全局安装webpack vue-cli3.创建项目并安装依赖4.启动项目原创 2020-08-30 22:36:06 · 312 阅读 · 0 评论 -
uni-带token请求封装
。原创 2020-09-06 21:42:48 · 2254 阅读 · 2 评论 -
uni-app之scroll-view组件
uni-app使用scroll-view组件不生效的问题横向滚动不生效横向滚动不生效的问题是因为少了两行代码:white-space: nowrap;display:inline-block;纵向滚动 必须指定滚动区域的高度。不设置高度的话,scroll-view是不会滚动的,此时滚的是页面。...原创 2020-08-31 16:23:08 · 10409 阅读 · 2 评论 -
js-replace替换所有字符
js中有方法replace可对字符进行替换,但是替换的只是第一个你要替换的字符,因此要自定义一个方法String.prototype.replaceAll = function (FindText, RepText) { return this.replace(new RegExp(FindText, "g"), RepText);}// console.log(pro.replaceAll('"','\"'));var proStr=pro.replaceAll('&am原创 2020-09-16 20:12:12 · 1176 阅读 · 0 评论 -
uni-computed属性传参
返回一个方法,方法中返回你要的值原创 2020-09-16 20:05:56 · 1520 阅读 · 0 评论 -
uni - 随机验证码
无原创 2020-09-06 20:53:42 · 520 阅读 · 0 评论 -
uni-购物车之批量删除
delSelect(){//删除选中的商品 var delectArry=[] this.goodlist.forEach((item,index)=>{ var arry ={}// 确保每次循环都创建一个新对象 var agoods=item.good var good=agoods.filter(function(goodsitem){ // console.log(goodsitem); if(goodsitem.select===true){ arry['原创 2020-09-03 15:50:02 · 1449 阅读 · 0 评论 -
uni/JS 购物车结算过滤多维数组与数组赋值改变原数组的一些问题
过滤多维数组和数组赋值不改变原数组原创 2020-09-01 18:55:04 · 554 阅读 · 0 评论 -
css-flex布局模仿表格小例子
闲来无事顺手写了个表格小栗子,很简陋,大概搭了一下壳。效果图:const data=[//定义数据 { key:1, name:'胡萝卜', other:[ { chengpin:'胡萝卜块sdfsv的好几个上课表达方式看地方很多风格化法国发挥规范化 ', danwei:20, beizhu:'1cmdsf' }, { chen原创 2021-04-23 12:01:26 · 1424 阅读 · 0 评论 -
ts对象成员设置初始值为空赋值为number
项目场景:在编写项目表单的时候,我们经常会使用到下拉选择器,对于选择器value的值一般为string或number类型,此次是为number类型的问题问题描述:在使用ts的对象成员时,必须对其赋初值,否则不能使用如batchMes.varietyId或对对象内不存在的值赋值。const [batchMes, setbatchMes] = useState({ batchName: '', batchNum: '', batchMeasure: 0, breedF原创 2021-05-12 09:42:50 · 16377 阅读 · 0 评论 -
antd-select选择器模糊查询
设置title<Select.Option value={item.landId} title={item.landName} key={item.landId}>{item.landName}</Select.Option>2.设置showSearch及 filterOption <Form.Item label={'所属地块'} name="landId" rules={[..原创 2021-05-12 09:11:02 · 1913 阅读 · 0 评论 -
Property ‘setGlobalOptions‘ does not exist on type ‘Map‘.Typescript 中 TS2339 报错
模型如果出现模块级别的写法。会出现TS2339.暂时的解决方法:(map.pm as any).setGlobalOptions做一个类型转换,暂时让TypeScript类型检查时忽略这个对象,从而编译通过不报错。有更好的办法感谢留言...原创 2021-05-07 09:09:31 · 395 阅读 · 0 评论 -
antd-Table组件渲染数据时出现第一行空白行
在表格设置了scroll之类会引起滚动的属性后,表格会在第一行之前生成一行tr,类名为ant-table-measure-row。同时如果还会遮挡部分选择框更改全局样式:global{ .ant-checkbox-wrapper{ margin: -3px !important; } tr.ant-table-measure-row{ // display: none; visibility: collapse;原创 2021-05-06 12:14:47 · 3994 阅读 · 0 评论 -
【react】create-react-app项目进行less配置
由于 create-react-app 脚手架中并没有配置关于 less 文件的解析,所以我们需要自己进行配置。需要安装插件 less less-loader。原创 2021-04-15 16:48:51 · 969 阅读 · 0 评论 -
React项目的创建
React环境准备及项目的创建环境准备:vscode或其他软件、node、yarn核心思想;组件化开发(js、es6)node.jsyarn原创 2021-04-15 10:35:28 · 75 阅读 · 0 评论