Ant Design 4.0 的一些杂事儿 - Select 篇 在antd 中,有一些语法糖组件不参与实际渲染或者有些特殊定制,导致其无法支持 HOC。比如Table.Column、Select.Option、Tabs.TabPane、Menu.SubMenu等等。我们有一串列表来记录了这些组件: https://github.com/ant-design/ant-design/issues/4853github.com/ant-design/a...
2.菜单项 (MenuItem, SubMenu) 选中或点击的事件代理: 将 Menu 的 onClick 与 onSelect 事件回调作为 context 传递到子组件,在 MenuItem 或 SubMenu 的 click 事件中调用,达到一个类似于事件代理的效果 3.菜单顶层 level = 1: Menu 作为最顶层组件,将 level 作为 context 传递到子组件,作为一个标的。SubMen...
Ant Design 设计规范和技术上支持灵活的样式定制,以满足业务和品牌上多样化的视觉需求,包括但不限于全局样式(主色、圆角、边框)和指定组件的视觉定制。 在5.0 版本的 Ant Design 中,我们提供了一套全新的定制主题方案。不同于 4.x 版本的 less 和 CSS 变量,有了 CSS-in-JS 的加持后,动态主题的能力也得到了...
ant design vue 树形表格展开一个所有都展开了 ant design vue tree,基本使用配置项replaceFields数据渲染属性依赖3个字段:title、key、children没有其他可携带的用户数据对接实际后台返回的数据,很多时候不是直接的title、key可以让我们直接渲染,这个时候replaceFields
最近做的一个项目是基于vue+AntDesign的。由于项目要求,需要在Table组件的行内点右键的时候弹出菜单。在线演示地址及最终效果图如下: 在线演示地址>> 首先新建一个Table组件的实例: <a-table :columns="columns" :rowKey="record => { return record.INDEX;}" ...
Ant Design Vue 递归Menu 使用vue函数式组件创建 antdvue1.x Vue.component('LmSubMenu', { functional:true, render: function (createElement, context) { console.log(context) let children=[]; context.props.menuInfo.child.forEach((item, index)=>{if(item.child) {...
Ant-design踩坑 Antd.Form 踩坑 经过getFieldDecorator的注册后,所以的onChange函数会被接管。本身的onChange可能会失效。 如果getFieldDecorator包裹的content包含多个child,要注意封装成一个组件,不要直接在content里用Fragment包裹多个节点,可能有隐患埋坑。如果希望包裹一个或多个组件,需要单独额外去封装一个组件来,会...
Ant Design Vue 设计规范和技术上支持灵活的样式定制,以满足业务和品牌上多样化的视觉需求,包括但不限于全局样式(主色、圆角、边框)和指定组件的视觉定制。 在4.0 版本的 Ant Design Vue 中,我们提供了一套全新的定制主题方案。不同于 3.x 版本的 less 和 CSS 变量,有了 CSS-in-JS 的加持后,动态主题的能力...
原生dom可以很容易的实现简单的dropdown,却很难满足我们的各种需求,因此各式各样的dropdown第三方实现就出现了。ant-design是基于react实现的一组UI组件,我们选择对其中的dropdown进行分析。 Dropdown 的主要组成: 一个弹出的下拉列表 一个当前的选中项
然而Ant Design Vue提供的对话框组件并没有提供拖拽的功能,但这一功能在项目中又是不可缺少的,所以只好自己动手丰衣足食。 封装一个drop-modal主要分三步: 让drop-modal拥有拥有a-modal的API 在drop-modal上实现v-model modal首次显示后实例化Draggabilly ...