- 博客(13)
- 收藏
- 关注
RSS订阅原创 react Context基本使用
理解一种组件间通信方式，常用于【祖组件】与 【后代组件】间通信使用创建Context对象 const XxxContext = React.createContext(）渲染子组件时，外面包裹XxxContext.Provider,通过value属性给后代组件传值，<xxxContext.Provider value={数据}>子组件</xxxContext.Provider>后代组件读取数据：//第一种方式：仅适用于类组件static contextType
2021-04-07 22:07:22
130
原创 react 组件优化
效率高的做法只有当组件的state或props数据发生改变时才能重新render()原因Component 中的shouldComponentUpdate() 总是返回true解决方法1：重写shouldComponentUpdate()方法比较新旧state 或props 数据，如果有变化才能返回true，如果没有返回flase方法2：使用PureComponentPureComponent 重写了shouldComponentUpdate(),只有state或者porps数据变化才
2021-04-07 21:49:59
115
原创 react Hooks基本使用
React Hook/Hooks是什么？Hook是React 16.8.0版本增加的新特性、新语法可以让你在函数组件中使用state以及其他的React特性三个常用的Hookstate Hook: React.useState()Effect Hook: React.useEffect()Ref Hook:Rect.useRef()State HookState Hook 让函数组件可以有state状态，并且进行状态数据的读写操作语法：const [XXX,setXxx]=Rea
2021-04-07 17:52:12
107
原创 react-redux 基本使用
求和案例——react-redux 基本使用(1). 明确两个概念：UI组件：不能使用任何redux的api，只负责页面的呈现、交互等。容器组件：负责和redux通信，将结果交给UI组件。(2). 如何创建一个容器组件-----靠react-redux的connent函数connect(mapStateToProps,mapDispatchToProps(UI组件)mapStateToProps:映射状态，返回值是一个对象；mapDispatchToProps：映射操作状态的方法，返回值是
2021-04-06 16:11:35
100
原创 React 路由基本使用
路由基本使用明确好界面的导航区、展示区导航区的a标签改为Link标签–><Link to="/xxxx">demo</Link>展示区写Route标签进行路由匹配 --> <Route path="/xxxx" component={Dome}/><App>的最外层包裹一个<BrowserRouter></BrowserRouter>或<HashRouter></HashRouter>路
2021-03-31 11:26:55
130
原创 react 新旧生命钩子对比
旧的生命周期初始化阶段：由React.render()触发----初次渲染constructor()componentWillMount()render()componentDidMount()更新阶段：有组件内部this.setState()或者父组件重新render触发componentWillReciveProps()shouldCompnentUpdate()componentWillUpdate()render()componentDidUpdate()卸载组
2021-03-28 10:18:06
125
原创 echarts 画一个半环形图
export default class componentName extends Component {constructor(props) {super(props);this.state = {viewConfig:{ } };}componentDidMount() { this.initChart()}initChart() { let myChart = echarts.init(document.getElementById('myring'));
2020-12-27 22:03:15
802
1
原创 自定义radio
`<labelrole=“radio”aria-checked=“true”class=“lg-radio”:class="{‘checked’: checked, ‘disabled’: disabled}"<span class="lg-radio__icon"></span><input type="radio" ref="radi...
2020-04-06 23:24:34
209
原创 react向元素内，动态添加style，class
react开发过程中，经常会需要动态向元素内添加样式style或className，那么应该如何动态添加呢？？？一、react向元素内，动态添加style例如：有一个DIV元素， 需要动态添加一个 display:block | none 样式， 那么：或者， 多个样式写法：二、react向元素内，动态添加className比如：1、DIV标签中，没有其他class，只需要动态添加一个...
2019-12-02 17:45:51
1650
原创 下拉刷新
vue 下拉刷新https://blog.youkuaiyun.com/qq_20097569/article/details/82493256
2019-10-10 21:56:18
129
原创 多行溢出，单行溢出css样式
多行溢出：display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;单行溢出：overflow: hidden;text-overflow:ellipsis;white-space: nowrap;欢迎使用Markdown编辑器你好！ 这是你第一次使用 Mark...
2019-10-03 21:05:52
389
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人