- 博客(16)
- 资源 (1)
- 问答 (1)
- 收藏
- 关注
原创 react通用组件-以toast为例
背景: 第一次使用react做项目,对所开发的通用组件进行一个思路上的整理。 在项目中,不管使用的技术栈是什么,都会出现一些通用组件,比如说toast、popup等。现在以toast为例,产出一个笔记。效果图:在通用组件对应代码目录,创建一个toast组件的目录,以common/Toast为例import propTypes from ‘prop-types’;使用propTypes对props传入的所有参数进行类型上的声明和限制,例static propTypes = {
2021-11-29 15:37:48
1486
原创 VUE 自定义日历+切换上下月+点击事件
背景:朋友想让我帮他写一个前端的日历demo,昨天晚上抽空搞了一下,产出了一个Demo。由于是简单demo,所以对样式上没有过多的调整。思路:获取每个月的第一天是周几,按照周几插入数据。上个月的在1号前面置空,下个月在月最后一天后面从1开始插入抽调函数,渲染传参,下个月和上个月切换功能也只要切换参数就可以。切换上个月或者下个月,只要把对应的年份、月份、日子传到下方渲染的公用方法里即可。效果图:代码:DOM结构 <div class="calendar">
2021-03-10 14:22:11
2357
原创 react学习笔记(三)--- 虚拟DOM && diff算法 && 搭建webpack
上一篇介绍了一些react相关的小概念,这篇主要介绍一下react自身的一些核心概念。
2021-02-25 11:38:04
155
原创 react学习笔记(二) --- 生命周期的相关理解
react学习笔记(二) — 生命周期相关理解 因为一直使用的技术栈是vue,但是觉得仅使用一个技术栈是不够的。所以选择了react进行学习和研究。无论学习vue还是react,生命周期是绕不过去的东西,所以今天专门开一篇,写一些自己的拙见。生命周期是什么? 生命周期是程序从开始到销毁的一系列过程。react分挂载、渲染、卸载的过程。 挂载是准备开始阶段,卸载是销毁阶段,渲染是更新阶段。 那么根据使用环节分为两种,一是 挂载卸载过程,二是 更新过程。下面分阶段来区分生命周期:组件载入阶段:
2021-02-25 11:16:16
133
原创 类似宝呗青年点击金钱收入到瓶子的动效
之前,有看到过支付宝宝呗青年的特效,具体就是点击元素,然后元素落入到一个大的收纳区在体验过程中,发现可以连点,只不过是执行完一个才执行第二个,但是支持连点。并且优化的话就是动态展示在周边几个不固定的位置,展示时有些一闪一闪的效果,类似星星坠落明天可以先做一个demo做某个小效果...
2021-01-12 22:06:35
196
原创 react学习笔记(一)--- 相关概念
最近因为工作的原因,要从头扎实的过一遍react的框架。这篇文章比较适合新手,也算是一个随手记吧。模块化:模块化的概念,更多的是从开发角度对可复用的能力进行抽调,比如说jsonp的封装。模块化的使用很大程度的便于开发人员开发与维护。组件化:组件化的概念,更多的是偏向于视觉和业务方面,是从页面视觉上封装可复用的区域及其背后逻辑能力,组件化的使用节省了RD的开发能力。并且随着开发的不断深入,接手项目的不断积累,可复用的组件会越来越多、越来越丰富。概念类 ⬇️vue与react的区别是一个经久不衰的话
2020-12-09 15:56:06
99
原创 node新手学习记录
情况: node执行脚本不会实时更新解决: 安装nodemon安装命令: npm install -g nodemon启动命令 nodemon 脚本.jsnode.js的应用组成部分require指令,使用require指令来载入node.js模块创建服务器,可以监听客户端的请求接收请求与响应请求,服务器很容易创建,客户端可以使用浏览器或终端发送 HTTP 请求,服务器接收请求后返回响应数据,相当于自我测试请求与返回以上就形成了一个后端的接口或者说响应...
2020-09-14 14:21:41
94
原创 VUE 三层组件嵌套异步传输没有获取到数据
在前一段时间开发的时候,有一个项目因为页面重新性比较多,所以抽调了不少组件,然后在组件嵌套组件的情况下,出现了孙级组件没有获取到encode值的情况背景: 组件异步传输的问题,TheLanding是父组件,friend是子组件,shareAll是孙组件,shareAll组件会用到encode值,这个encode值是存储在TheLanding中的,会有一个问题就是传输的时候其实encode还没有值,所以就是出现一个时机的问题,采用了三种种方法存入session,还是会出现encode为空的情况,时好时坏
2020-07-14 11:51:51
1461
原创 VUE 子组件和父组件之间的传值
什么叫做子组件和父组件传值?他的概念和常用情况是什么?我的理解是这样的,子组件封装,父组件调用,但在代码中也只是在父组件,例如:goods.vue中使用shopcart(子组件)代码块.形成以下情况:goods.vue :<shopcart @on:cart-add="cartAdd"> </shopcart>而在使用过程中常常需要把子组件的值传给父组件以达到值实...
2019-10-19 15:26:45
166
原创 VUE数据传输 Avoid mutating a prop directly since the value will be overwritten whenever the parent compo
在页面传输中,遇见此报错 : Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop’s value. Prop bei...
2019-10-18 12:34:21
313
原创 微信小程序自定义tabbar详解
之前用的tabbar一直是系统自带的,后来发现制约太多,不是特别美观。于是还是自定义了一套tabbar使用。首先新建一个templte文件夹,我放的位置是与pages同级的,路径就是"/template/template"template.wxml<template name="tabBar"><view class="tabBar"> <block wx...
2019-08-08 16:23:46
518
3
原创 微信网页端支付功能(前端)详解
微信支付功能其实与登录授权功能是有相通之处的,都是调用微信的JSAPI,直接搜索JSAPI就可以看见微信支付的文档。接下来我说一下支付功能我的思路。首先 :用户登录进入页面,支付调取统一下单接口,后台使用统一下单与微信支付系统换算,生成一个预付单信息并带有支付参数传给前端其次 :用户发起支付,确认支付,提交一个支付授权,后台为微信支付系统验证授权,返回前端参数,判断是否支付成功下面详细解...
2019-06-28 13:40:21
3160
2
原创 微信网页登录授权详解(前端)
前几天做了一个H5页面项目,它是依托于微信服务号的网页.需要包含微信登录、微信支付以及微信订单查询功能;在这里说一下先说一下微信登录授权功能的实现**微信登录授权**微信登录授权呢,分为静默授权和非静默授权;两个的区别是scope属性的属性值不同,scope= scopr_base是静默授权也就是不弹出页面,直接获取用户信息,scope=scope_userinfo是非静默授权,用户需要同意...
2019-06-26 11:57:42
5007
2
如何监听用户对文件的另存为行为呢?
2022-02-23
TA创建的收藏夹 TA关注的收藏夹
TA关注的人