随笔分类 -  React

React
React + MobX 状态管理入门及实例(一)
摘要:第二章 React + MobX 状态管理入门及实例(二) 前言 现在最热门的前端框架,毫无疑问是React。 React是一个状态机,由开始的初始状态,通过与用户的互动,导致状态变化,从而重新渲染UI。 对于小型应用,引入状态管理库是"奢侈的"。 但对于复杂的中大型应用,引入状态管理库是"必要的" 阅读全文

posted @ 2021-12-14 20:51 漫思 阅读(273) 评论(0) 推荐(0) 编辑

Typescript + Taro Ts怎么在类组件中,定义state,props,以及hook中ts的简单实用
摘要:ts在taro类组件中怎么使用定义使用state,使用方式跟在js类组件中一样,直接使用this.state.属性名,使用方式一样, 定义state稍微有点区别,在js中我们是这样定义的: class Index extends Component { constructor(props) { su 阅读全文

posted @ 2021-12-08 19:36 漫思 阅读(591) 评论(0) 推荐(0) 编辑

3分钟掌握hook在typescript中的姿势
摘要:3分钟掌握hook在typescript中的姿势 2020-01-14阅读 1.1K0 hook结合typescript可以说是很香了。本文主要介绍hook结合typescript 如何使用,享受ts带给我们的编辑器提示和类型约束 useState useState如果初始值不是null/undef 阅读全文

posted @ 2021-12-08 19:34 漫思 阅读(322) 评论(0) 推荐(0) 编辑

翻译:在 React Hooks 中使用 Typescript 小记
摘要:翻译:在 React Hooks 中使用 Typescript 小记 零之彼岸关注 0.722019.06.15 19:56:12字数 1,949阅读 7,462 在 React Hooks 中使用 Typescript 小记 最近在关注 Typescript 和 react hook 相关的知识, 阅读全文

posted @ 2021-12-08 19:02 漫思 阅读(94) 评论(0) 推荐(0) 编辑

浅谈 TypeScript - 无状态函数组件
摘要:浅谈 TypeScript - 无状态函数组件 icepy 程序员,机车党,隐居山野的农夫 多数情况下,无状态的函数组件会用于一些纯粹的视觉展示,它可能是无操作的列表,甚至是一个无操作的按钮。根据以往的理解,在 TypeScript 的世界中,无状态函数组件被设计为 React.SFC,它只能接收  阅读全文

posted @ 2021-12-08 19:01 漫思 阅读(54) 评论(0) 推荐(0) 编辑

react setSate 不生效的问题
摘要:叫我马爷,大声叫 1、setSate this.state.a1=this.state.a1+1 this.setSate({a1:this.state.a1}) //这样生效吗? 不生效,因为this.state.a1 会去内存的读取,get操作,所以this.state.a1=this.stat 阅读全文

posted @ 2021-12-08 11:43 漫思 阅读(275) 评论(0) 推荐(0) 编辑

数据转换的思考
摘要:在一些场景上不明显,但是在内存场景上比较明显 1、map 2、filter import _ from 'lodash' 启用loadash 通过一组的id值,查询数据,得到数据 const filterByArray = (keys, inputArray, keyname) => { retur 阅读全文

posted @ 2021-12-08 11:32 漫思 阅读(33) 评论(0) 推荐(0) 编辑

hook中和class组件中使用refs
摘要:hook使用ref 父组件: 引入 useRef 声明ref的名字 const dateRef = useRef() 复值给组件 ref={dateRef} 使用 dateRef.current.funName下面的方法 子组件: 引入 useImperativeHandle,forwardRef 阅读全文

posted @ 2021-12-04 17:40 漫思 阅读(245) 评论(0) 推荐(0) 编辑

React JSX file giving error “Cannot read property 'createElement' of undefined”
摘要:import { assert } from 'assert'; import { MyProvider } from '../src/index'; import { React } from 'react'; const myProvider = ( <MyProvider> </MyProvi 阅读全文

posted @ 2021-08-10 12:17 漫思 阅读(85) 评论(1) 推荐(0) 编辑

精读《useEffect 完全指南》
摘要:1. 引言 工具型文章要跳读,而文学经典就要反复研读。如果说 React 0.14 版本带来的各种生命周期可以类比到工具型文章,那么 16.7 带来的 Hooks 就要像文学经典一样反复研读。 Hooks API 无论从简洁程度,还是使用深度角度来看,都大大优于之前生命周期的 API,所以必须反复理 阅读全文

posted @ 2021-08-05 18:09 漫思 阅读(341) 评论(0) 推荐(0) 编辑

通过React实现数据报表的展示
摘要:通过React实现数据报表的展示 我们致力于实现以下的内容 1、头部锁定。 2、横向滚动和纵向滚动。 3、斑马线效果 4、悬停效果 5、点击效果 6、无数据时,说明没有数据库 7、当数据出措时显示,出错原因,并提示刷新的功能 阅读全文

posted @ 2021-06-04 23:33 漫思 阅读(539) 评论(0) 推荐(0) 编辑

浅谈 useRef
摘要:开始之前我们先看一个例子 代码如下: 注意,这个 alert 方法是放在 setTimeout 被延迟了 2S 才执行 渲染出来的页面是这样的: 一开始,当我们点击 Alert 按钮,然后猛点那个点赞按钮,你觉得最后的弹框会提示你点击了几次? 1次,还是多次? 答案是1次 可以看见,按钮上显示的点击 阅读全文

posted @ 2021-05-14 19:38 漫思 阅读(1333) 评论(1) 推荐(0) 编辑

useState回调函数
摘要:在看的小朋友,新的react hook写法,官方默认setState方法移除了回调函数,推荐使用useEffect,但是改动的数据过多还是有很多问题。so,我在useState基础上扩展了回调函数功能,就可以像以前类写法一样传递回调方法啦。 话不多说上代码 import {useEffect, us 阅读全文

posted @ 2021-05-14 15:30 漫思 阅读(3365) 评论(0) 推荐(0) 编辑

最近的问题
摘要:1、redux的优势,必须严格意义上的优势。 2、fusion和antd的表单验证,动态表单验证,文件上传。动态编辑 3、路由和浏览器的参数,只能在根部,不能在子节点上。 4、如何在根节点上在子节点上共享props tigger redux localstroage 5、react如何用启用多项目。 阅读全文

posted @ 2021-04-25 17:29 漫思 阅读(43) 评论(0) 推荐(0) 编辑

Alibaba Fusion Design深度教程
摘要:import React, { useState } from 'react' import { Button } from '@alifd/next'; import { Input, Button, Field, DatePicker2 } from '@alifd/next'; functio 阅读全文

posted @ 2021-03-28 21:12 漫思 阅读(504) 评论(0) 推荐(0) 编辑

Alibaba Fusion Design 的form教程
摘要:import React, { useState } from 'react' import { Button } from '@alifd/next'; import { Input, Button, Field } from '@alifd/next'; function index() { c 阅读全文

posted @ 2021-03-28 21:05 漫思 阅读(423) 评论(0) 推荐(0) 编辑

useState的深度思考
摘要:import React, { useState } from 'react' import { Button } from '@alifd/next'; function index() { //只要useState的值发生变化,就机会一直到debugger这,所以total会一直清空,这就是us 阅读全文

posted @ 2021-03-28 20:58 漫思 阅读(177) 评论(0) 推荐(0) 编辑

npm qs 模块(中文)
摘要:本文基本使用谷歌翻译加上自己的理解,权当加深记忆。 npm 简介 qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库。主要维护者:Jordan Harband最初创建者和维护者:TJ Holowaychuk 用法 var qs = require('qs'); var assert = 阅读全文

posted @ 2021-02-02 20:30 漫思 阅读(720) 评论(0) 推荐(0) 编辑

npm包之query-string
摘要:安装 npm i --save-dev query-string 常用API 1. qs.parse(string, [options]) import qs from 'query-string'; location.search // ?name=jim location.hash // #to 阅读全文

posted @ 2021-02-02 19:28 漫思 阅读(972) 评论(0) 推荐(1) 编辑

Handling Events
摘要:Handling events with React elements is very similar to handling events on DOM elements. There are some syntax differences: React events are named usin 阅读全文

posted @ 2021-02-01 20:01 漫思 阅读(137) 评论(0) 推荐(0) 编辑

导航