一.H5制作 - 图片文本的动画效果 bug:打开一个模板,添加图片,添加动画效果,若先选定动画效果,再调节动画时间和延迟时间,则动画和延迟时间没有改变:若先调节动画时间和延迟时间在选定动画效果,则动画和延迟时间可以实现. 期望:先选定动画效果,再调节动画时间和延迟时间,动画和延迟时间也能实现. 问题原因:原代码中的动画数据保存时机设置在选择动画类型的时候 只能先选时间再选动画,如果先选动画再选时间,后选的时间就保存不了了 解决方法:①将slider组件的onChange方法关掉,只保留onAf…
1.表单rule中可以分对象处理不同规则 <FormItem label="类型名称" {...formLayout}> { form.getFieldDecorator('name', { rules: [ { required: true, message: '请输入2-5字中文.数字.或英文类型名称' }, { pattern: /^[\u4E00-\u9FA5A-Za-z0-9]+$/, message: '请输入2-5字中文.数字.或英文类型名称'}, { min…
第一个React + Ant Design网页(一.配置+编写主页) 引用博主的另外一篇VUE2.0+ElementUI教程, 请移步:  https://blog.csdn.net/u012907049/article/details/72764151 Ant Design是UI设计语言.Ant Design同样出身名门,是阿里巴巴旗下蚂蚁金融服务集团(旗下拥有支付宝.余额宝等产品)所设计的一个前端UI组件库.目前支持了React, 并且有一个对Vue支持的测试版本. http://ant.d…
最近在学习react时,用到了很流行的UI框架Ant Design,也了解了一下Ant Design Pro,发现它们都有导航组件,Ant Design框架的导航菜单在这里,Ant Design Pro是权限菜单,权限菜单简单来说就是根据登录的权限来展示不同的菜单给用户,比如管理员有给用户分配不同角色的权限,那管理员就可以看到系统管理等导航菜单,而用户A只有发布某些业务的权限,那用户A就不能看到系统管理的导航菜单等等.不过这不在我们本文的考虑范围内,有兴趣的同学可以自行去看它的API:Autho…
前言:接着上一篇项目总结,这一篇是学习过程记录的最后一篇,这里会梳理:评论组件.商家组件.优化.打包.相关资料链接.项目github地址:https://github.com/66Web/ljq_eleme,欢迎Star. ratings seller 一.评论组件-ratings 评论组件主要分为三块 评分信息-overview 评论选择-ratingselect 评论详细信息 评分信息部分 左侧评分 布局Dom <div class="ratings-content">…
Ant Design Pro项目打开页设为登录或者其他页面 一.打开页设为登录页 首先找到utils包中的authority文件,在该文件中找到如下代码: export function getAuthority(str) { // return localStorage.getItem('antd-pro-authority') || ['admin', 'user']; const authorityString = typeof str === 'undefined' ? localSto…
前言 一.React是Facebook推出的一个前端框架,之前被用于著名的社交媒体Instagram中,后来由于取得了不错的反响,于是Facebook决定将其开源.出身名门的React也不负众望,成功成为当前最火热的三大前端框架之一.相比于Angular,React更加轻量.而相对于另一个轻量级前端框架Vue来说,React虽然学习和使用起来难度稍微大一些,但是React的社区相对来说人气更旺,而且在移动端的开发上面,大名鼎鼎的React Native更是尽显优势,在代码性能上要好过Vue框架.…
首先,你需要先装一个Nodejs,这是基础哦.如果没有这方面知识的小伙伴可以在园子里搜索cnpm yarn等关键字,内容繁多,此不赘述,参考链接 一. 简介 1. Ant Design Pro v5 开箱即用的中台前端/设计解决方案,没有用过的小伙伴先撸一遍文档.基于React,需要一定的基础. 2. Ant Design 配套组件,另外Antd还设计了超级组件 ProComponents,看着有点麻烦,不过我猜用起来应该很爽. 3. v5是预览版默认ts,目前不可选js版本.前端ts是一个趋势…
如何实现canvas根据父容器进行自适应? Ant Design的组件都提供了强大的自适应能力,为了对齐父组件,镶嵌在Ant Design组件里的canvas也需要能根据父级容器进行自适应的能力,页面高度一般不用做自适应,因为即使太多内容页面太长,也会出现滚动条,所以问题不大,问题在于宽度,屏幕尺寸各不同,如果宽度不够,元素就会被挤变形或者换行 步骤: 首先,固定canvas的height,对于width 1.实时获取父组件的尺寸 2.实时修改canvas的尺寸 1 这里使用一个npm的包,可以…
项目框架 采用React.js作为项目的框架 采用redux作为数据管理的框架 采用antd作为项目的UI组件 采用echarts完成项目中折线图的绘制 个人项目工作流程总结 拿到UI高保真图片之后先对整个页面进行模块化分,大的模块分为上部的折现图部分,中间部分的网元的拓扑图部分,下部分表格部分以及表格点击后的弹出层部分.每个模块有可以再次细分为模块的头部(头部数据基本不变化),以及模块的内容展示部分. 基本就这样把整个页面细分成不同的组件模块,子组件又可以组成父组件,大的父组件完整组合成整个页…