- 博客(76)
- 收藏
- 关注
原创 koa搭建服务器(二)
操作数据库就可以使用Sequelize内置的方法了,这里用我的查询接口为例,接口可以支持日期、状态、分类、分页查询,所以需要动态给where添加相应的条件。由于在实际项目中连接一个数据库中的多个表,所以在这里我建了一个models文件夹,index.js用来遍历models文件夹下的js文件并依次创建实例。框架其他的一些方法可以看下以下文章,首先也是需要安装相关的依赖。
2023-10-29 15:34:53
303
原创 react的setState做了什么
setState这个方法在调用的时候是同步的,但是引起React的状态更新是异步的。在React中,如果是由React引发的事件处理(比如是通过onClick引发的事件处理,以及生命周期函数调用setState),调用setState不会同步更新this.state,除此之外的setState调用会同步执行this.state。如果需要对state数据更改监听,就可以使用第二个参数,它是用来监听state里面数据的更改,当数据更改完成,调用回调函数,用于可以实时的获取到更新之后的数据。
2023-10-22 20:11:39
601
原创 react&antd(11)<Table />组件更改dataSource和columns时页面不更新渲染的问题
组件增加一列数据,于是我在该状态下对columns进行操作并把更新后的columns重新setState,但是此时页面的表格并没有更新渲染,我在控制台打印的columns却已经是更新后的了。因为columns和dataSource都是一个对象数组([{},{},{}]),所以我们更改columns/dataSource时引用地址并没有改变,改的只是引用地址指向的内存数据。
2023-06-19 17:14:16
3876
原创 npm报错The operation was rejected by your operating system问题解决
npm报错The operation was rejected by your operating system问题解决
2023-04-23 17:44:34
999
原创 git推送远程仓库报错解决
kex_exchange_identification: Connection closed by remote hostConnection closed by 20.205.243.166 port 22fatal: Could not read from remote repository.Please make sure you have the correct access rightsand the repository exists.
2023-04-08 23:55:30
1098
原创 js实现JSON字符串格式化显示
最近有个需求是需要把后端返回的json数据格式化显示,处理其实很简单,先用JSON.parse()把json数据转为json对象,再用JSON.stringify()把JSON对象 转换为 有缩进的 JSON字符串格式。
2023-03-15 11:46:55
1868
原创 moment 时间戳转为固定格式时间错误
有个需求是后端返回的时间格式是一个时间戳,例如:我们在页面上展示之前需要把这个时间戳转换为标准格式的时间。如果在页面上看到转换的时间有问题,请务必留意下转换格式有无问题。在转换时要注意格式,如果格式错误那么转换到的时间也会有问题。首先我们需要引入moment这个库。
2023-03-08 10:23:00
832
原创 CSS利用定位+margin实现元素居中
原理:父级设置相对定位,子级设置绝对定位,而且当前四个定位属性的值都设置了0。上面代码是子元素设置了100px的宽和40px的高,但是实际上子级的虚拟占位已经撑满了整个父级,这时候再给它一个margin:auto它就可以上下左右都居中了。这种方案不要求父元素的高度,也就是即使父元素的高度变化了,仍然可以保持在父元素的垂直居中位置,水平方向上是一样的操作。设置margin为负数时,使内部子元素到方块3的位置,即中间位置。当设置left、top为50%的时候,内部子元素为方块2的位置。初始位置为方块1的位置。
2022-11-06 17:02:36
981
原创 cookie sessionStorage localStorage 区别
cookie 只属于某个路径下 存储大小限制也不同,cookie 数据不能超过 4K,同时因为每次 http 请求都会携带 cookie,所以 cookie 只适合保存很小的数据,如回话标识。webStorage 虽然也有存储大小的限制,但是比 cookie 大得多,可以达到 5M 或更大 数据的有效期不同。cookie:只在设置的 cookie 过期时间之前一直有效,即使窗口和浏览器关闭 作用域不同 sessionStorage:不在不同的浏览器窗口中共享,即使是同一个页面;
2022-10-29 16:52:20
80
原创 react&antd(9)可选链操作符?.编译失败原因及解决方法
背景:在react项目中使用?.可选链操作符浏览器报错提示编译失败。完成上述步骤后就可以在项目中使用可选链操作符了。2.在pack.jison文件添加插件。1.npm i 导入依赖包。
2022-10-16 14:25:10
2193
原创 react&antd(8)动态Form表单的实现
思路:在state用一个变量来存一个状态,然后通过单选框的Onchange事件来改变这个变量的值,根据不同的值来切换不同的在工作中遇到一个需求是根据用户不同的选择切换出不同的提供给用户输入。
2022-10-01 17:11:10
2199
原创 react&antd(7)data is read-only 的只读问题解决
经过排查后发现是一个很低级的错误,因为const定义的是常量,无法对data再进行操作了,这里只需把const换为let就可以了。在日常工作中我们经常会遇到有一些字段不是必传到后端那边的,而是根据用户是否对该字段来进行操作再决定是否传给后端。思路:判断state的该字段的值是否为默认值,如果不是的话就通过解构来把该字段加进去。但是这样写会报错提示 data is read-only。
2022-09-25 11:50:53
2476
原创 react&antd(6)js原生input文件上传框样式美化
思路:input框可以先把之前的按钮透明度opacity设置为0,然后外层用div包裹。通过冒号对齐antd提供了相应方法,可以去antd搜索form表单。在上个需求中虽然功能完成了,但是原生input框的样式太简陋了,不符合页面的整体风格,而且上面三个输入框也没有对齐,所以需要美化样式。
2022-09-23 21:20:48
1274
原创 react&antd问题(5)js原生input实现用户上传txt文件并解析
在工作中遇到一个需求是希望前端解析用户上传的txt文件后封装成一个数组通过json格式发给后端,在这里我并没有用antd的组件,而是用了js原生的input来做。思路:通过js的fileReader对象来读取用户上传的txt文件,然后通过\n切割成一个数组再通过post请求发给后端。用户可以通过粘贴订单到订单列表来发送订单,也可以通过上传txt文件来发送订单,也可以同时粘贴订单和上传文件。如果用户在订单列表粘贴了订单也上传了文件,那我们可以在发请求的时候解构订单数组把用户粘贴的订单加进去。
2022-09-23 21:01:21
1061
原创 react&antd问题(4)
思路:点击批量查询后弹出一个模态框,然后通过换行输入多个id,点击查询后把订单数组通过post请求发给后端。在工作中遇到一个需求是批量输入订单id,然后把这个订单id的数组传过去给后端。
2022-09-18 14:00:26
280
原创 react&antd问题(3)
在工作中遇到一个需求是对后端接口返回的关键词在文本中检索并且进行标红,如果文本过长就只显示标红字符串的前后10个字符。
2022-09-11 16:15:28
256
原创 react&antd问题(2)
思路:在模态框里面套一个form表单就可以了,这个在antd有现成的可以直接拿来用。在工作中遇到一个需求是页面新增一个领取功能,点击提交后会把数据提交到后端处理。
2022-09-11 15:59:29
115
原创 react&antd问题
在工作有一个需求是点击相应的按钮换成标签相应的颜色,但是按钮没有标签的那个颜色,于是只能通过style来加。这是原来的写法,但是这样写有很多重复的代码,而且也不美观,于是我在搜索了后换了下面的代码。...
2022-08-27 11:37:35
225
原创 react学习
1.state的使用2.通过setState来修改状态3.this的指向问题a.用箭头函数绑定thisb.用bind方法绑定thisc.用class方法来绑定4.受控组件5.多表单元素优化 6.组件的props7.props的特点 8.组件传递的三种方式a.父组件传递数据给子组件 b.子组件传递数据给父组件 c.兄弟组件...
2022-07-13 00:58:58
150
原创 小泼猴案例页面的动态渲染
1.首先我们自己准备一个假的后端数据接口用来模拟,通过在在线平台fast mock上我们可以完成。2.在动态渲染之前我们先写好静态的HTML页面和css样式,在写完后开始准备写js3.在js中我们需要引入axios来对接口进行ajax调用(method是进行调用的方法,url是上面写的模拟接口,有了这个后我们就可以用then来接收数据)4.接收到数据后先用foreach对得到的数据进行遍历,这里的item指的是正在遍历的数组成员,index指的是该数组成员的下标。遍历后我们就可以进行字符串的拼接了。拼接完后
2022-07-10 22:19:42
627
原创 form表单
1.form标签的属性1.1 action属性 1.2 target属性1.3 method属性 1.4 enctype属性2.如何快速获取form表单的数据(通过serialize函数可以快速获取)
2022-07-06 22:20:49
107
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人