react
coding_forever
长相一般痴迷技术城市青年爱好广泛
展开
-
React 动态增加,删除,上下移动dom <li><td>
思想在react的世界里,都是状态变更(数据变更)来驱动dom变化,动态添加dom不像以前用jquery一样append一个<li>或者一个<td> 这样了,而是通过装载<li> 或者<td> 数据数组[]来动态添加dom,下面的例子实现使用了antd的组件库 参考:https://ant.design/components/form-cn/#components-form-demo-dynami原创 2017-12-19 16:41:51 · 21480 阅读 · 3 评论 -
create-react-app 引入less与sass
引入less1.安装react-app-rewired,react-app-rewire-less,babel-plugin-import命令行: - npm install react-app-rewired –only=dev - npm install react-app-rewire-less –only=dev - npm install babel-plugin-i...原创 2018-06-08 17:29:48 · 4403 阅读 · 2 评论 -
react fireworks 烟花特效
老样子,先上图(mock数据)1.实现方法 引入自己写的react烟花库:react-fireworks ,详细使用方式见: github:https://github.com/liuyuqin1991/react-fireworks/tree/master...原创 2018-06-22 18:45:55 · 2788 阅读 · 0 评论 -
react 自定义的数字样式滚动效果
老样子,先上图(mock数据) 1.实现方法引入countup.js数字滚动插件的react版本react-countup,github:https://github.com/glennreyes/react-countup 自定义formattingFn方法2.具体实现:JS://引入react-countupimport CountUp from 'react-...原创 2018-06-21 11:49:59 · 7604 阅读 · 3 评论 -
create-react-app JS里使用图片
1.JS加载图片import img from '../../image/xxx.png'2.JS使用图片const item = [{ type:"bar", barGap:"5%", barMaxWidth:"20", barMinHeight:"10", itemStyle:{ normal: { label:{ sho...原创 2018-06-04 11:12:58 · 2525 阅读 · 0 评论 -
React Ueditor 数据交互
集成集成方法见:http://www.jianshu.com/p/d5d5ee66e733 ,这篇文章讲的很详细交互实例1:及时反馈输入实现:原理: 在ue组件中创建监听selectionchange事件,并且在事件中调用从父组件继承的回调函数,来及时响应到父组件中。1.Ue组件:import React, { Component, PropTypes } from 'react';class U原创 2017-12-19 21:43:47 · 3775 阅读 · 4 评论 -
遮罩层上滚动,使下方的列表随之滚动
效果遮罩层为一张边框样式图(如下图):边框样式遮罩层显示在最上方,然后是中间的列表,最下层是一个透明黑色遮罩层,滚动鼠标滚轮,能控制列表滚动实现原理注册最上面遮罩层的滚动事件,拿到滚动滚动方向,然后控制列表滚动的方向和距离上代码注册事件/** * 增加滚轮滚动事件(暂时只实现了chrome的滚动效果) * @param modalDomId 遮罩层domI...原创 2018-07-27 15:01:33 · 1297 阅读 · 1 评论