赵乘风_i

使用了 antd 新组件库，但是基准都是 14px，而系统的默认基准是 12px，通过一些全局配置，可以直接将基准调至 12px参考 antd 主题配置最开始，采用的是 webpack的配置方式，也就是在webpack.config.js中，在 less-loader，设置紧凑主题（compact）但其实结果不太理想，在本地是可以正常调整到12px，但在发布dev之后，有的是12px，有的还是14px。这非常使人疑惑，最后大概认为是 打包后资源请求先后的问题，但我也不能每个修改样式，然后加.

现在的项目是基于antd了，但又要和之前的UI保持一致，设计师希望还用之前的tabs 标签页的样式，所以就需要在antd Tabs的基础上进行一些样式的修改。如下：在 antd Tabs type='card'的基础上进行样式修改<div className='c-tab-capsule'> <Tab type='card'> {children} </Tab></div>.c-tab-capsule { .ant-tabs-

需求背景在最近的项目中，遇到一个比较复杂的场景，点击触发后会打开modal弹框，但是因为情况比较多，总共有3种方式都可以打开modal框，所以在父组件的处理就比较复杂，涉及到了多次渲染，就导致modal框在打开的时候，会闪一下。我也知道，处理好多次渲染的问题，modal框应该在打开的时候就不会闪了，但是，因为需求场景比较复杂，如果要处理多次渲染，那就会导致modal框打开后的各种问题，所以不能修改解决在仔细看了官网的api后，发现一个属性， maskTransitionName 其实就是将Modal

基本的配置大概已经结束了，现在我们可以使用antd的组件来进行业务开发了。改动的地方是这些新建一个全局菜单文件 layout/index.jsimport React from 'react';import { Layout, Menu, Icon, Breadcrumb } from 'antd';import { withRouter } from 'react-router-do...

有一个需求是下拉菜单中有操作，但有些操作是有前提条件的，比如 批量启用 就需要在选择了数据之后。所以设置disabled来控制它操作还是不可操作。但是会出现一个问题，在<Menu.Item></Menu.Item>中的 不是 string就会导致 disabled不能生效也就是以下情况<Menu.Item key="1" disabled={dis}>...