wangweiscsdn的博客

React如何实现类似Vue的Keep Alive功能，可以引入react-activation库

视频自动播放会影响PWA的安装

了解一下PWA应用

视频播放兼容iOS与Android

视频懒加载

使用useRoutes时如何统一设置title？

iconfont 的symbol方式引入项目不显示

用craco去配置create-react-app的移动端，实现px-to-rem或者px-to-viewport、alias别名等其他webpack配置

react-sortable-hoc 拖拽组件消失

准备echarts中国地图的json（在最后）先注册地图import * as echarts from 'echarts';import { dataChina, cityValue, geoCoordMap } from './china';echarts.registerMap('china', dataChina, {}); 地图部分geo: { roam: false, // 是否开启鼠标缩放和平移漫游 map: 'china', itemStyle: { area

useEffect99% 的情况下都用这个。当钩子稳定并且如果重构任何类组件以使用钩子时，可以将任何代码从 componentDidMount、componentDidUpdate 和 componentWillUnmount 移动到 useEffect。useMutationEffect这在 React 渲染您的组件的同时同步运行。如果要改变 DOM，就用这个钩子，但前提是你不需要从 DOM 中读取值。useLayoutEffect这会在 React 执行完所有 DOM 更改后立即同步运行。如果

需求来源于产品和UI快速开始<!-- Include stylesheet --><link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet"><!-- Create the editor container --><div id="editor"> <p>Hello World!</p> <p>Some initia

父组件引用子组件例子import {useState} from 'react';const MemoTest = () => { const [name, setName] = useState('名称') const [content,setContent] = useState('内容') return ( <> <h3>{content}</h3> <button onClick

react-grid-layout有什么用呢？实现拖拽，网格布局安装 react-grid-layoutnpm install react-grid-layout创建一个GridLayout组件import React, { Component } from 'react';import { Responsive, WidthProvider } from 'react-grid-layout';import './index.scss';const ResponsiveGridLay

直接用????就可以说明，所以看看代码就能明白父组件import React, { useRef } from 'react';const Parent = props => { const childMethodRef = useRef(); const handleChildFun = () => {childMethodRef.current.childFun('test'); } const fun2 = () => {childMethodRef.

拖拽其实用h5的设置元素draggable就可以了，看代码就可以了拖拽容器import React from 'react';// 拖拽容器const Draggable = props => { const { dragRef, dragItem, handleDragStart } = props const img = new Image(); img.src = 'https://drag.png'; // 拖拽时的图片可以更改，一定要先设置src，再setDragIma

需求多个视频要用同一个进度条控制播放暂停进度条这个可以用antd的Slider组件<Slider marks={marks} max={maxTime} defaultValue={timeValue} value={timeValue} tooltipVisible={false} onAfterChange={(v) => handleAfterChange(v)} onChange={(value) => handleSliderValue(value)}/

防抖的意思就是用户输入的时候不会频繁请求接口，一旦用户停下来在设定的时间内都没有再输入，那就可以发送请求，所以这样就减少了请求防抖这个用hooks有点小麻烦，主要是要获取input传入的参数event.persist(),这个是要加上的，不然会报一个警告，如下图所示：翻译一下就是：由于性能原因，此综合事件被重用。如果您看到此消息，那么您正在访问已发布/无效的合成事件上的属性“ target”。设置为空。如果必须保留原始的合成事件，请使用event.persist（）i...

定义分享按钮和canvas画布// 分享按钮<View className='job-bottom-share share' onClick={() => this.handleOpenShare()}> <View> <Text className='iconfont icon-share-ic share-img'></Text> </View> <Text>分享</Text></V

先来看看原来啥样子要解决简单，就是给这个自定义组件添加任意属性，比如：看看添加属性之后的结果：就剩下一个啦！参考：https://github.com/NervJS/taro/issues/4929...

高德用的汽车路线规划，动画回放的功能，路线颜色改不了，粗细也改不了，所以会很丑。甲方爸爸很生气，后果很严重！！！先来欣赏一下改之前的长什么样然后改之后看看：是不是好看很多！！！只贴部分代码片段哈，主要用react， 下面的代码我是写在componentDidUpdate里面的，用的高德JS API哈~const { Map, Marker, Size, Pix...

React 里调用axiosthis.confirmPasswordModal = () => { const { passwordParams, passwordValidation,passwordChanging } = this.state; console.log('passwordParams',passwordParams); const {

1. yum install nodejs2.npm 淘宝镜像配置// linuxnpm install -g cnpm --registry=https://registry.npm.taobao.org

效果如图所示：输入会有提示：代码如下：class Suggest extends React.Component{ getValue(){ return this.refs.lowlevelinput.valaue; } render(){ const randomid=Math.random().toString(16).substring

表格效果如图所示：const headers=['bookName','Author','Language','Published','Sales'];const data=[ ['Tfd rod','J.F','English','1954-1955','150milion'], ['Td rod','E.A','English','1904-1965','250milio

JSXGraph是Web浏览器中的交互式几何，功能绘图，图表和数据可视化的跨浏览器JavaScript库。用react组件化如图：在左边框里输入代码，右边可以实现图形react父组件如下：import GraphComponent from './GraphComponent';import Menubar from './Menubar';requir

1、先安装node,js2、node -v3、npm -v4、npm install -g create-react-app   然后查看create-react-app版本5、create-react-app mynews  给react应用命名，你可以取另外一个名字，然后出现success就是成功了！6、然后cd mynews  并且npm start  可以在http://localhost...

这个也是在实际项目中遇到的坑，毕竟我比较年轻～_～先来个父组件的代码：// 父组件class Car extends Component { constructor(props){ super(props); this.state = { smallCar: { color:'red' } }; this.re...

出现这个错误的原因是请求回来数据时直接跳转，没有dispatch比如这样会出现错误：export const getWithdrawCheck = () =&gt; { const userId = getStore('customerUserId', 'session') const userPhone = getStore('userPhone', 'session') ...

我是遇到了这个问题，是因为mobx装饰器的问题，然后找到了彻底解决的办法，请参考链接：https://cloud.tencent.com/developer/ask/193850是这个回答，我截个图，不然下次忘了：...

这种长列表加载很多页之后，然后跳转至某个详情页面再返回到列表页要到原来的位置最重要的是加ref，ref={ node => handelRef(node) }， 还有就是要动态的设置initialListSize的值，首屏渲染的条数，不然默认只渲染20条，等你数据加载超过20条就不能滚动到指定位置哦~ <ListView r...

第一次遇到input的defaultValue不会变化，或者只记录前一次的数据，后面的数据不会及时更新，而value是不能改变input的值的解决办法就是给父级的div或者form添加一个可变的key值class TeacherInfoWidget extends React.Component{ render(){ const {onChange,teacherInfo,No