givingwu / fe-components

All front-end components that previously written based on React/Vue & jQuery.js

fe-components

This repository used to collect all react/jquery/vue/* components previously i wrote.

Components List

React

React Components

• BMap 之前编写的跟百度地图相关的组件。
  • LazyloadMap 懒加载百度地图API的组件。
  • Location 获取用户地理信息组件，先调用 getLocationByGeo，然后才回退到getLocationByIP。
  • DrivingRoute 传入起点(start)、终点(end)、途径点(waypoints)绘制驾车路线组件。
  • AutoCompleteInput 顾名思义。
• Calendar 简单的 React Calendar 的组件，可基于此实现更高级扩展的功能。
• ColorCollect 利用 webWorker 收集图片颜色的组件。
• *ColorGradient 自动渐变，暂未实现。
• ListView ListView 组件的实现。
• MobilePreview 提供一个 iPhone 外壳内部自填充 children 元素的容器组件。
• Placeholder 炫酷的 CSS 实现的 Placeholder 效果。
• TreeView
• TransitionFade
• Turntable 大转盘的组件。
• WarningError ant-mobile 组件。

React HOC

• withLazyLoadMap 高阶组件版实现。
• *withUrlOpts 不建议使用，仅供参考。

React Multiple Pages

RoadHog + Webpack，参考 code 查看详情。

Vue

Vue Components

• Vue-Table-Tree Vue Table + Tree 的实现。
• Vue-Virtual-List Vue 虚拟滚动列表的实现。
• TODO: Vue-Virtual-Tree

jQuery

jQuery Components

• CheckBox 没什么好说的，JS实现的自定义 Checkbox。
• InputNumber 电商购物车加减按钮，功能丰富。支持 最大、最下、浮点数、步长等。
• OpacityBanner 电商首页透明切换等banner，类 tmall 首页 banner 效果。
• PreviewSwitcher 电商商品详情页，动态切换预览图。
• CategoryMenu 电商 懒加载 种类菜单列表，优化首屏渲染很有效果，支持服务端数据和本地数据。
• *Cascader 电商切换区域的级联选择器
• *LazyLoadDOM 电商客户端渲染，根据用户交互懒加载特定的 DOM 节点。jquery.inview + template engine

The questions previously met

0. js 语法错误，编译不报错，阻塞在进度条步骤
1. win7 在npm run build时一直停留在91% additional asset processing
2. fix: import from lost dep will cause 100% cpu
3. yarn start一直卡在roadhog server不动
4. FAQ: dev/build 卡死、慢、CPU 100% 等问题

Thanks

License MIT.