- 博客(63)
- 收藏
- 关注
原创 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
3680
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
3324
原创 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
1563
原创 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
574
原创 antd-select下拉框如何同时获取所选值ID和名字属性
其中传过去的e为:从antd官网可以看到select组件的onchange属性传参,第一个参数为value,第二个参数可为所选中的那一项的所有信息。其中的props属性内有一个children属性,即存储了所选项的名称...
2021-11-16 17:55:27
3887
原创 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
1028
原创 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
2532
原创 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
3028
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
147
原创 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
365
原创 react 父组件调用子组件的方法
方法二在项目中的实际应用父组件中:onSubmitShare = () => { this.setState({ submitCheck: this.state.submitCheck + 1, }); };子组件中:UNSAFE_componentWillReceiveProps(nextProps) { if (this.props.submitCheck !== nextProps.submitCheck) { ...
2021-10-14 18:12:38
117
原创 react子组件修改父组件中的值
实现思路: 在父组件中定义一个方法,并且在子组件中绑定,然后在子组件中可以通过props去调用到父组件中的方法。父组件中:const toshare = () => {this.setState({visibleShare: false,})}<Child share={toShare}/>此时,子组件就可以通过props获取父组件中的方法handleSumit = ()=> {...
2021-10-14 18:03:51
3303
原创 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
7517
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
529
原创 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
5575
原创 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
14239
转载 使用better-scroll 封装的vue组件 不能滚动到底部 一种解决方案
https://blog.csdn.net/Charissa2017/article/details/104833848/
2021-08-28 18:27:39
599
原创 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
661
转载 Vue-cli4 配置文件路径别名以及使用详解
https://blog.csdn.net/czj1049561601/article/details/113799619修改了vue.config.js文件,一定一定一定要重启项目才生效!!!!折腾了好久!!!!
2021-08-28 01:50:52
407
转载 Error: Can‘t find Python executable “python“, you can set the PYTHON env variable.解决办法
https://blog.csdn.net/qq_39165556/article/details/94590365
2021-08-25 00:37:42
350
原创 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
4476
转载 phpstudy和navicat的冲突
容易导致密码不一致而上不去navicathttps://blog.csdn.net/weixin_46034990/article/details/104742459
2021-08-24 22:41:07
387
原创 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
417
1
原创 在idea中配置Maven
1.在file中选择settings.点击maven,设置好路径,本地仓库等2.在pom.xml文件中添加依赖,点击右上角的加载符号,既可加载相关依赖
2021-08-24 21:56:38
57
转载 跨域问题前后端的解决方法
https://panjiachen.github.io/vue-element-admin-site/zh/guide/advanced/cors.html
2021-08-24 20:37:13
81
转载 Echarts报“export ‘default‘ (imported as ‘echarts‘) was not found in ‘echarts‘错解决方法!
https://blog.csdn.net/Aom_yt/article/details/110947734
2021-08-23 01:13:40
632
原创 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
750
原创 怎么获取数组中的对象的属性来进行判断
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
2225
原创 cascader级联选择器
value值:指定选项的值为选项对象的某个属性值(选中的属性)label值:指定选项标签为选项对象的某个属性值(看到的属性)children:指定选项的子选项为选项对象的某个属性值(用于级联)v-model由于数据的双向绑定,绑定selectedKeys值,在实例中,value值用于存储对象的id, 因此selectedKeys也是一个用于存放选定对象的id的数组, <!-- props用来指定配置对象 --> <!--...
2021-08-18 23:12:14
957
1
转载 Element-UI 中 el-cascader 显示问题解决
https://blog.csdn.net/xxxzzzyyybiu/article/details/116755193
2021-08-18 18:52:38
1232
原创 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
1035
原创 角色分配的业务逻辑梳理
核心:需要获取到所有全选或者半选的节点的id,然后用以,分割的字符串向服务器发起请求而,获取全选或者半选的可以通过tree控件中getCheckedKeys(),getHalfCheckedKeys()1.把分配的确定按钮绑定一个分配函数 <!-- 分配权限的对话框 --> <el-dialog title="分配权限" :visible.sync="setRightDialogVisible" ...
2021-08-17 23:23:36
176
原创 注意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
97
原创 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
165
原创 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
118
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人