React
React 项目的点点滴滴
不二博客
世界巨大,我以渺小来爱他。时间悠长,我以短暂来爱他。
展开
-
dva/dynamic LoadingComponent 属性实现路由切换的加载效果
前言我们使用的dvajs项目中我们一般使用dva/dynamic进行路由动态加载解决引入models的问题,但是随之而来的一个新的问题就出现了,当每次进入新的页面的时候总会有一段js执行的时间是空白的状态对于客户的体验感不是很好。文章目录前言LoadingComponent属性二、使用步骤1.引入加载组件2.定义组件3.路由配置总结LoadingComponent属性在dva/dynamic中有一个隐藏属性LoadingComponent属性,这个属性是知道js执行完成渲染页面前显示的组件。原创 2020-09-09 17:38:31 · 1149 阅读 · 0 评论 -
React 项目兼容低版本浏览器
兼容低版本浏览器真的是让人头大,不过现在好在有框架鱼插件的运用,让我们轻松的兼容低版本浏览器,本文中以 DvaJS Cli 举例下载 react-app-polyfill 和 core-js 插件npm install react-app-polyfill core-js --save使用插件在 ./src/index.js 的最上方引入插件import 'core-js/es' import 'react-app-polyfill/ie9' // 引入兼容的版本,一般ie9就可以了im原创 2020-08-12 20:39:32 · 4091 阅读 · 0 评论 -
部分 React Hooks 的运用
目录前言useMemouseRefuseContextuseReducer前言在 React Hooks 中,分为基础 Hook 和额外的 Hook ,这之前的文章中有写到过基础的 Hook 中的 useState和useEffect的运用,那么今天就跳过这两个 Hook 继续向下介绍部分 Hook ~useMemouseMemo 是可以作为性能优化,把创建函数和依赖项作为参数,它仅仅在依赖项改变时才会重新计算。import React, { useState, useMemo } from 'r原创 2020-07-29 17:00:23 · 121 阅读 · 0 评论 -
React DvaJS组件接收状态得两种方式
以下示例均在DvaJS环境中moldes中的cms.js文件下。同一页面渲染的不同组件// ./index/index.jsimport Home from './home';@connect(({ layout, share, index, list, cms }) => ({ layout, share, index, list, cms }))// ./index/home.jsconst Home = ({ dispatch, index, cms, setSelected,原创 2020-07-25 01:11:53 · 264 阅读 · 0 评论 -
DvaJS 的核心概念
DvaJS 概念DvaJS是一个轻量级的框架,其共有6大核心概念,分别为State、Action、dispatch函数、Reduer、Effect和Subscription。数据流向通过 dispatch 发起 action,同步直接 Reducers 改变 State,异步则触发 Effects 流向 Reducers 改变 State。StateState 是Model的状态数据,export default { // 命名空间 namespace: 'example', sta原创 2020-07-25 00:56:02 · 234 阅读 · 0 评论 -
State Hook 与 Effect Hook 的运用
目录Hook 是什么?State HookEffect HookHook 是什么?Hook 是一个特殊的函数,可以使你不编写类组件的情况下使用state以及其他React的特性。State Hookimport React, { useState } from 'react';function Example(){ // 创建一个变量count,创建一个改变变量count的方法setCount,并且设置变量初始值为0; const [count, setCount] = useState(原创 2020-07-22 20:31:53 · 245 阅读 · 0 评论 -
记录React 的安装与运用以及生命周期
目录下载创建下载首先需要确保NodeJS在较新的版本,输入以下命令可以下载搭建本地环境。npx create-react-app my-app进入项目目录后输入命令 npm start 启动项目。创建原创 2020-06-23 19:58:36 · 145 阅读 · 0 评论