react
文章平均质量分 55
清风笑~
display:none
展开
-
react从render开始与内部执行与实现(一)
学习笔记react17.0.2中render方法内部执行与实现原创 2023-04-14 16:25:49 · 567 阅读 · 0 评论 -
webpack插件编写dumi实现js静态参数文档生成
项目是umijs搭建的,为了完善项目说明文档就引入dumi 负责组件开发及组件文档生成,但项目是js编程非ts,dumi解析props参数时只支持ts不只是js的。完善功能就配合Webpack编写一个插件解析js中的参数props。...原创 2022-03-24 20:50:59 · 2031 阅读 · 0 评论 -
pont生成前端接口层代码
Pont 利用接口元数据,可以高度定制化生成前端接口层代码原创 2022-02-17 14:23:50 · 1274 阅读 · 3 评论 -
基于umijs+lerna+qiankun的微前端实现
基于umijs+lerna+qiankun的微前端实现原创 2022-02-09 15:15:02 · 2339 阅读 · 2 评论 -
codeceptjs前端UI自动化测试
最近做UI自动化测试,就选择了codeceptjs。其框架好处文档里都有,比如场景驱动——从用户的角度编写验收测试。使测试可读且易于遵循。Driver Agnostic — 测试可以通过WebDriver、Puppeteer、TestCafe、Protractor、Appium等帮助程序运行。所有这些代码都是相同的。初始化项目npm init -ynpm install -g allure-commandlinenpm i codeceptjs --save一路回车键或者自行定义.b原创 2021-06-07 11:35:17 · 1233 阅读 · 5 评论 -
react中对PureComponent的深度认识
谈react优化其中最重要的一个组件就是PureComponent,主要的特点就是当数据即使发生深层次的变化,PureComponent也不会更新而且影响到子组件。那PureComponent和Component的之间的联系在哪里,以下是对react框架代码的一些理解。一、都是从React.js中暴露出来, 删除多此次不相关代码import {Component, PureComponent} from './ReactBaseClasses';const React = { Childre原创 2020-05-10 23:16:34 · 947 阅读 · 0 评论 -
小程序使用taro时集成redux-saga
使用taro开发小程序时,初始化小程序taro init myApp选择redux组件。可以看到redux中, store.js里使用的是redux-thunk管理异步import { createStore, applyMiddleware, compose } from 'redux'import thunkMiddleware from 'redux-thunk'import ...原创 2019-06-04 00:21:37 · 2026 阅读 · 0 评论 -
webpack3升级到webpack4
webpack4出来有一段时间了,现在3升级到4运行npm i npm-check -gnpm-check -u选择要更新的依赖,loader之类都更新到最新npm i webpack-cli --save-devdev和prod 添加不同modeutils.js css 预编译处理 前缀于 loder配置, 生产打包使用MiniCssExtractPluginexpor...原创 2019-04-22 16:34:47 · 2992 阅读 · 0 评论 -
react使用redux时reducer的重用和去switch判断
通常在redux中写reducer时,根据action传递过来的type,进行判断,数据处理也是在reducer中。当然不用if 就用switch,大多数还用的switchexport default (state = initState, action) => { switch(action.type) { case LOGIN: retu...原创 2018-12-08 20:25:17 · 2018 阅读 · 0 评论 -
react中redux利用redux-persist数据持久化
前端数据需要存在本地,来避免多次请求,提高前端效率。可以选的有cookie,localstorage,localsession各中区别,主要的就是大小限制等比如登录信息,管理系统的权限,菜单列表等,还是选择存localstorage/localsession吧。在每次请求到数据后都去调用一次localstorage.set()感觉也挺麻烦的,最好的就是redux里有了数据就直接自动放入local...原创 2018-12-04 13:19:51 · 8621 阅读 · 0 评论 -
记react中antd打包的坑体积太大和className命名
前端使用antd的时后打包体积太大, 如图1.6M还是挺大的,把antd所有的资源都加载进入了根据antd 官网的推荐,按需加载方式居于.babel配置这样再来看看打包分析的按需加载打包了button和layout 在src文件下也只引用了这个两个组件这样做很方便的,同时要在entry这里在添加一个antd就不对了, 又把整个antd打包进来了, 这样就不对了entry: {...原创 2018-11-26 13:07:20 · 8154 阅读 · 0 评论 -
react-native,redux,redux-saga组合开发实现
简单的说搞react开发的痛点之一,单向数据流的传递,redux统一管理数据,redux-saga又处理管理了异步调用。要实现的内容如下,界面目录结构首先从请求接口入手,用axios封装请求接口,统一处理请求 axios.jsimport axios from 'axios'let defaultConfig = { timeout: 3000,}let ...原创 2017-12-24 23:11:15 · 4408 阅读 · 2 评论 -
react i18n 实现国际化
react i18n 国际化 react-intl react-dom原创 2016-10-27 13:58:34 · 18297 阅读 · 17 评论 -
vue-cli的webpack配置,迁移适用到react开发配置webpack
最近搞vue,用的vue-cli,快速构建开发环境,当然核心还是集成的webpack。之前自己做react的webpack环境配置总觉得差强人意,于是就把vue-cli的迁移过来,感觉还是不错的。对应一般开发需要,下面需要修改的就在build和config目录下的几个文件中从webpack.base.conf.js 文件开始,无论生产环境还是开发环境都以这个为基础的,...原创 2017-10-26 22:44:45 · 2096 阅读 · 0 评论 -
react-navigation之TabNavigator, StackNavigator使用配合redux
我在react-navigation的组件StackNavigator 和TabNavigator组合使用在加上redux,出现如下问题there is no route defined for key ***must be one of这个类似的在react-navigation的github也有,StackNavigator里嵌套一个TabNavigator,navred...原创 2017-07-09 17:21:53 · 4976 阅读 · 0 评论 -
react-native结合react-navigation之TabNavigator
react-native开发需时肯定有tab的切换,或者页面的转调,当然用RN自身的Navigator也可以但是也不是那么方便react-navigation 就能满足很多大部分需求,如下图的三种切换方式,下面就说下TabNavigator 和StackNavigator的应用,才踏的一个坑,还是太年轻呀,横刀一撸!!!!主要的界面 用tab 切换即是TabNavigator, 切换如下...原创 2017-07-08 02:35:15 · 20990 阅读 · 3 评论