- 博客(63)
- 收藏
- 关注
RSS订阅原创 React + antd +DatePicker组件禁用小于当下时间之前的时间，包括时，分
一、DatePicker组件的设置。showTime设置时间只显示时，分，不显示秒disabledDate函数：设置日期的禁用disabledTime函数： 设置时间的禁用<DatePicker onChange={e => this.changeTime(e, 'beginTime')} placeholder="请选择开始时间" showTime={{ format: 'HH:mm' }} showToday={false} getC
2022-01-22 15:45:31
4003
2
原创 react，父组件如何获取子组件的值
class Son extends React.Component { render() { return <input onChange={this.props.onChange}/>; }}class Father extends React.Component { constructor() { super(); this.state = { son: "" } } changeHandler(e) { thi.
2021-12-09 16:05:07
3415
原创 react,umi,antd-pro的layout封装过程
import React from 'react';import { Layout, Form, Icon } from 'antd';import isEqual from 'lodash/isEqual'; //深度比较对象import memoizeOne from 'memoize-one'; //降低渲染的函数复杂度，提高性能import { history, connect } from 'umi';import { ContainerQuery } from 'react-co..
2021-12-09 15:03:29
1649
原创 redux资料合集
1.redux的设计思想https://segmentfault.com/a/1190000015367584https://segmentfault.com/a/11900000153675842.redux的应用实例redux 使用实例 - 简书一. 纯原生 redux 的使用 Redux 是常用的状态管理容器，能够帮助我们对一些全局变量进行有效管理。首先，举一个场景：我正在开开心心的逛淘宝商城，点进了一个淘宝店家的...https://www.jianshu.com/p/bdebab039a.
2021-12-07 10:27:34
606
原创 antd-select下拉框如何同时获取所选值ID和名字属性
其中传过去的e为：从antd官网可以看到select组件的onchange属性传参，第一个参数为value，第二个参数可为所选中的那一项的所有信息。其中的props属性内有一个children属性，即存储了所选项的名称...
2021-11-16 17:55:27
4133
原创 es2020新特性双问号可选链的区别
1. 双竖杠||：将前面的值自动转为布尔值并且为false时，(如undefined、null、false、空字符串和数值0),就取后面，否则取前面。例：console.log(0 || 52)打印出52console.log(false || 52)打印出52console.log(null|| 52)打印出52console.log(undefined|| 52)打印出522. 双问号：前面的值为null、undefined，则取后面的值，否...
2021-11-16 14:42:29
1084
原创 Warning: validateDomNexting(...): ＜div＞cannot appear as a descendant of ＜p＞
Warning: validateDomNexting(...): <div>cannot appear as a descendant of <p>原因分析： 报错显示，<p>标签不能作为<div>标签的父标签。但是如果发现自己整张代码都没有所谓的<p>标签，还是报错。那就可以考虑是否运用了一些封装好的组件，里面是用p标签写的。例如antd的result组件，description属性里用<div>就会报错，解决方法是可.
2021-11-12 17:43:03
2677
原创 antd的TreeSelect组件，把后台返回的数据处理成树形结构
思路：1、定义一个空数组nodeData,用于存储新构造的对象，let nodeData =[];2、遍历后台传来的数组treeData，treeData.map（）（1）定义一个空对象，let treeObj = {};（2）将数组中需要的属性赋值给新对象，作为新对象中的一个属性treeObj.title = item.deptName; treeObj.value = item.deptName treeObj.key = item.dept...
2021-11-01 18:38:11
3161
4
原创 Array数组的常用方法
splice()方法向/从数组添加/删除项目，并返回删除的项目。slice(start,end) start表示要提取的片段的起始下标,end表示提取片段最后一个字符的后一个字符的下标；注释：splice()方法会改变原始数组。1.两个参数都为正数var str="Hello happy world!"document.write(str.slice(6,11)；运行结果: 'happy'2.若end参数未指定，则选取从start下标开始的所有字符var str="Hel...
2021-10-26 14:15:11
179
原创 git 拉取代码和提交代码
git init 初始化，新建本地仓库git clone +项目地址 拉取项目，拉取是默认分支git pull origin develop 拉取开发分支代码git checkout develop 切换到开发分支git checkout -b newBranch 基于开发分支下新建一个和develop一样的分支,在新分支上进行修改git add . .
2021-10-25 18:14:39
400
原创 react 父组件调用子组件的方法
方法二在项目中的实际应用父组件中：onSubmitShare = () => { this.setState({ submitCheck: this.state.submitCheck + 1, }); };子组件中：UNSAFE_componentWillReceiveProps(nextProps) { if (this.props.submitCheck !== nextProps.submitCheck) { ...
2021-10-14 18:12:38
147
原创 react子组件修改父组件中的值
实现思路： 在父组件中定义一个方法，并且在子组件中绑定，然后在子组件中可以通过props去调用到父组件中的方法。父组件中：const toshare = () => {this.setState({visibleShare: false,})}<Child share={toShare}/>此时，子组件就可以通过props获取父组件中的方法handleSumit = （）=> {...
2021-10-14 18:03:51
3451
原创 React hook中父组件调用子组件的方法
一、父组件的操作： 利用useRef创建一个ref实例，并且绑定到所调用的子组件中父组件的主要代码：import React, {useRef} from 'react';const parent = (props) = { const shareRef = useRef(); return ( <div> //子组件 <Child ref={shareRef}/> </
2021-10-14 17:45:06
7777
3
原创 React中出现 Uncaught TypeError: Super expression must either be null or a function, not undefined
classClockextendsReact.Component(){constructor(props){super(props);this.state={date:newDate()};}应该是classClockextendsReact.Component{constructor(props){super(props);...
2021-09-23 16:13:04
569
原创 react中背景图片和图片引入的方法
// 有三种引入背景图片的方法1.<div style={{backgroundImage: `url('图片路径')` }}> 2. 先import引入图片路径，再用es6语法中的$引用import bgImage from '@/assets/images/bgImage.webp'<div style={{backgroundImage: `url(${bgImage})`}}>3.用require进行路径引用require("图片路径").
2021-09-22 17:23:24
6013
原创 flex局部的知识总结
一、Flex布局的基本概念。（1）Flex布局： 任何一个容器都可以指定为Flex布局。注意：设为Flex布局以后，子元素的float、clear和vertical-align属性将失效。（2）Flex容器：采用Flex布局的元素，称为Flex容器（flex container），简称”容器”。（3）Flex项目：它的所有子元素自动成为容器成员，称为Flex项目（flex item），简称”项目”（4）容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（...
2021-09-20 01:21:37
14335
转载 使用better-scroll 封装的vue组件 不能滚动到底部 一种解决方案
https://blog.youkuaiyun.com/Charissa2017/article/details/104833848/
2021-08-28 18:27:39
668
原创 Better-Scroll2.0的用法注意事项
1. 对于better-scroll插件，是包含了所有的插件的，体积较大安装方式：npm install better-scroll --save2.但是，BetterScroll2.0开始可以按需加载插件但是，如果只想实现基本功能，就只需要装（1）import BScroll from "@better-scroll/core";（2） 其他的附加功能就额外安装，例如上拉加载，下拉更新这些import PullDown from "@better-scroll/pull..
2021-08-28 18:22:26
707
转载 Vue-cli4 配置文件路径别名以及使用详解
https://blog.youkuaiyun.com/czj1049561601/article/details/113799619修改了vue.config.js文件，一定一定一定要重启项目才生效！！！！折腾了好久！！！！
2021-08-28 01:50:52
439
转载 Error: Can‘t find Python executable “python“, you can set the PYTHON env variable.解决办法
https://blog.youkuaiyun.com/qq_39165556/article/details/94590365
2021-08-25 00:37:42
390
原创 code EBUSYnpm ERR! syscall renamenpm ERR! path D:\node\node_global\node_modules\windows-build-too
D:\project\vhr\vuehr>D:\project\vhr\vuehr>npm install --global --production windows-build-toolsnpm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142npm WARN deprecated har-validator@5..
2021-08-24 23:59:38
4613
转载 phpstudy和navicat的冲突
容易导致密码不一致而上不去navicathttps://blog.youkuaiyun.com/weixin_46034990/article/details/104742459
2021-08-24 22:41:07
439
原创 fatal: unable to access ‘https://github.com/lenve/vhr.git/‘: OpenSSL SSL_read: Connection was reset,
'https://github.com/lenve/vhr.git/ 改成 'git://github.com/lenve/vhr.git/即可
2021-08-24 22:18:22
441
1
原创 在idea中配置Maven
1.在file中选择settings.点击maven,设置好路径，本地仓库等2.在pom.xml文件中添加依赖，点击右上角的加载符号，既可加载相关依赖
2021-08-24 21:56:38
78
转载 跨域问题前后端的解决方法
https://panjiachen.github.io/vue-element-admin-site/zh/guide/advanced/cors.html
2021-08-24 20:37:13
106
转载 Echarts报“export ‘default‘ (imported as ‘echarts‘) was not found in ‘echarts‘错解决方法！
https://blog.youkuaiyun.com/Aom_yt/article/details/110947734
2021-08-23 01:13:40
663
原创 ElementUI的tag标签在添加时如何过滤掉重复的标签
inputVisible: false, inputValue: "", tempTag: '', isRepeatedData: falseif (row.attr_vals.indexOf(row.inputValue) != -1 && this.tempTag != row.inputValue) { this.isRepeatedData = true; this.$message.warning('...
2021-08-20 01:28:11
817
原创 怎么获取数组中的对象的属性来进行判断
const { data: res } = await this.$http.get('categories/' + this.cateId + '/attributes', { params: { sel: this.activeName } } ) if(res.meta.status !== 200) { return this.$message.error('获取参数列表失败！') } ..
2021-08-19 04:21:01
2275
原创 cascader级联选择器
value值：指定选项的值为选项对象的某个属性值（选中的属性）label值：指定选项标签为选项对象的某个属性值（看到的属性）children：指定选项的子选项为选项对象的某个属性值（用于级联）v-model由于数据的双向绑定，绑定selectedKeys值，在实例中，value值用于存储对象的id, 因此selectedKeys也是一个用于存放选定对象的id的数组， <!-- props用来指定配置对象 --> <!--...
2021-08-18 23:12:14
1047
1
转载 Element-UI 中 el-cascader 显示问题解决
https://blog.youkuaiyun.com/xxxzzzyyybiu/article/details/116755193
2021-08-18 18:52:38
1286
原创 ElementUI分页功能的逻辑梳理
1.通过handleSizeChange函数监听当前页展示的数据条数是多少，然后把值传给querInfo中的pagesize。2.通过handleCurrentChange函数监听当前页的改变是什么，然后把值传给querInfo中的pagenum（有点感觉到querInfo是作为数据双向绑定的一个中介）3.把监听到的数据传给querInfo，然后向服务器发送请求，返回querInfo中请求的params,然后在分页区中把current-page,page-size都绑定querInfo中相对应.
2021-08-18 15:59:50
1155
原创 角色分配的业务逻辑梳理
核心：需要获取到所有全选或者半选的节点的id,然后用以，分割的字符串向服务器发起请求而，获取全选或者半选的可以通过tree控件中getCheckedKeys(),getHalfCheckedKeys()1.把分配的确定按钮绑定一个分配函数 <!-- 分配权限的对话框 --> <el-dialog title="分配权限" :visible.sync="setRightDialogVisible" ...
2021-08-17 23:23:36
196
原创 注意path的写法以及用户体验的提升
async removeRightById(role, rightId) { const confirmResult = await this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).catch(err => err) if (confirm.
2021-08-17 18:37:57
119
转载 手机号验证最新正则表达式
转载：https://blog.youkuaiyun.com/itbrand/article/details/109239620
2021-08-16 18:38:34
323
原创 es6变量结构解析-数组结构解析疑惑点
function f() { console.log('aaa');}let [x = f()] = [1];以上代码等价于let x;if ([1][0] === undefined) { x = f();} else { x = [1][0];}等价的代码中[1][0]是什么意思？，实际上，[1][0]是一个简写，意思是数组中只存在一个数[1]，然后需要取出数组的第零个数字，也就是取出1代码等价于：let arr = [1]arr[0]，也就是说..
2021-08-13 19:08:43
196
原创 git的常用操作命令
1,查看状态：git status2.创建新分支：git checkout -b login3.查看分支： git branch4.添加新建，修改的代码： git add .5.把暂存区的代码提交到本地仓库： git commit -m "完成了。。。。”6.合并分支：需要合并啥就要先切换到那个分支(1) git branc1h(2).git checkout login(3)git merge login7.推送到云端仓库： git push8.把本地子分支推送到.
2021-08-13 04:00:59
134
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人