这种做法 不直观，每次都得去iconfont复制名称使用 每次增删改图标需要重新替换整个JS 不能按需加载，没使用到的也会一起打包，特别是UI换图标时一般不会将旧图标删除.......快速上手 \- Ant Design Vue[2] 删除冗余组件 部分组件是不经常用的，但却使用了Vue.use()全局引入了。...这里去掉不常用和没用到的全局引入，改为页面内import()引入 ⚡优化Ant-design-icon体积 内容（点击展开/收起） 这一部分，由于我们在项目中只使用了几个Ant内置图标，不可能有530+...重定向到本地来控制 这个问题，在React版的Ant-Design是已经是做了处理的了（写法上有所调整），但在Ant-Design-Vue-1.x中仍然没有官方解决方案。...所幸，dayjs作者提供了一个插件，可以将Ant-Design-Vue的moment替换成dayjs 虽然文档中只说Ant-Design-React可以用，但实际上在issue可以看到它也适用于antdV
vue-ant design示例大全——本地css/js资源 ---- 示例资源来自官网：https://www.antdv.com/components/button-cn 在 Ant Design...主按钮：用于主行动点，一个操作区域只能有一个主按钮。 默认按钮：用于没有主次之分的一组行动点。 虚线按钮：常用于添加操作。 文本按钮：用于最次级的行动点。 链接按钮：一般用于链接，即导航至某位置。...危险：删除/移动/修改权限等危险操作，一般需要二次确认。 幽灵：用于背景色比较复杂的地方，常用在首页/产品页等展示场景。 禁用：行动点不可用的时候，一般需要文案解释。...加载中：用于异步操作等待反馈的时候，也可以避免多次提交。 <!...FAQ # 如何移除 2 个汉字之间的空格 # 根据 Ant Design 设计规范要求，我们会在按钮内(文本按钮和链接按钮除外)只有两个汉字时自动添加空格，如果你不需要这个特性，可以设置 ConfigProvider
升级好最新前端框架后，让我们回到Mock服务前后端的配置服务开发中，最开始我们已经学会了Antd pro的中后台框架的创建，以及使用Ant Design组件进行布局式开发前端页面。...ProComponents ProComponents 是基于 Ant Design 而开发的模板组件，提供了更高级别的抽象支持，开箱即用。...官网 https://procomponents.ant.design/ 模版组件 主要提供如下组件 ProLayout 解决布局的问题，提供开箱即用的菜单和面包屑功能 ProTable 表格模板组件，...项目中使用 直接通过引用到 js/tsx中即可 // 每一个包都是一个独立的组件包，比如ProForm使用示例如下 import React from 'react'; import { ProForm...引入方法：import { ProTable } from '@ant-design/pro-components'; 区域布局参考如下图，其中所有部分都可以通过属性配置按需显隐 Img 重要API：
CSS样式表定义如何显示 HTML 元素，类似 HTML 中的字体标签和颜色属性所起的作用那样。样式保存在外部的 .css 文件中。...HTML5是HTML最新的修订版本，其设计目的是为了在移动设备上支持多媒体。 CSS3 是最新的 CSS 标准。 其次，需要学习Bootstrap和jQuery。...3、Ant Design React Ant Design React，也是一个优秀的组件库，用于研发企业中后台产品。...它的相关资源：Ant Design Pro、Ant Design Charts、Ant Design Vue、Ant Design React等（详见官方文档） 除此之外，前端的UI框架还有很多很多，...除了要学习以上这些，我们在开发前端的过程中，还可能会用到图标、可视化图表等等，所以，还需要学一些相关的框架。 比如Feather、ECharts、Axios等等。
Ant Design Pro 的布局 在 Ant Design Pro 中，我们抽离了使用过程中的通用布局，都放在 layouts 目录中，分别为： BasicLayout：基础页面布局，包含了头部导航...UserLayout：抽离出用于登陆注册页面的通用布局 BlankLayout：空白的布局 ?...如何使用 Ant Design Pro 布局# 通常布局是和路由系统紧密结合的，Ant Design Pro 的路由使用了 Umi 的路由方案，为了统一方便的管理路由和页面的关系，我们将配置信息统一抽离到...icon: 当前路由在菜单下的图标名。 hideInMenu: 当前路由在菜单中不展现，默认 false。 hideChildrenInMenu: 当前路由的子级在菜单中不展现，默认 false。...Ant Design 布局组件# 除了 Pro 里的内建布局以为，在一些页面中需要进行布局，可以使用 Ant Design 目前提供的两套布局组件工具：Layout 和 Grid。
移动端 100vh 问题 在移动端使用 100vh 时，发现在 Chrome、Safari 浏览器中，因为浏览器栏和一些导航栏、链接栏导致不一样的呈现： 你以为的 100vh === 视口高度 实际上...覆盖 Ant Design Vue 样式 设计师眼中的 Ant Design === '丑'（心酸）。...干掉无用的图标 Ant Design Vue 把所有的 Icon 一次性引入（不管你因用了多少个组件），这使得体积打包后图标所占的体积竟然有几百 kb 之多。...这些图标大多数不会被设计师所采纳，所以部分图标都应该被干掉： 创建一个 icons.js 来管理 Ant Design Vue 图标，这里以一个 Loading 图标为例： // @/src/assets...在 @ant-design/icons/lib 目录下有三种风格的图标，分别是 fill、outline、twotone，这里面内部的文件并不是 svg 格式，而是 js 和 ts 格式，这就是为什么我们可以这么引入图标的关键所在了
以.js 文件为组件 文件中通过字符串模板定义 html 和 css，然后在自定义元素的构造函数中引入它们。...统一 UI 风格 经过实测，Ant Design 这样基于 React 框架的 UI 库无法按需打包出单独的组件，因此需要针对特定组件进行 CSS 模拟，例如，本仓库中通过调整样式，将第三方表格库渲染成...Ant Design 的风格，后面我会逐一实现其他使用到的 Ant 组件。...，然后随时通过字体设计软件来编辑它————后者在发布的时候无须删除任何多余文件，更加方便。...，因为用户的操作系统和浏览器中已经内置了几十万个 Unicode 图标，几乎可以涵盖所有场景，因此首选方式是从 Unicode 库中搜索可用的字符然后直接拿来用，有 2 种搜索方式可选：字符含义、字符形状
：END, HOME 在当前行中向右移动到最后一个非空白单元格。...删除插入点左边的字符，或删除选定区域：BACKSPACE 删除插入点右边的字符，或删除选定区域：DELETE 删除插入点到行末的文本：CTRL+DELETE 向上下左右移动一个字符：箭头键 移到行首：HOME...箭头键 选定区域扩展到单元格同行同列的最后非空单元格：CTRL+SHIFT+ 箭头键 将选定区域扩展到行首：SHIFT+HOME 将选定区域扩展到工作表的开始：CTRL+SHIFT+HOME 将选定区域扩展到工作表的最后一个使用的单元格...：SCROLLLOCK, SHIFT+HOME 将选定区域扩展到窗口右下角的单元格：SCROLLLOCK, SHIFT+END 13>Excel快捷键之处于End模式时展开选中区域 打开或关闭 END...模式：END 将选定区域扩展到单元格同列同行的最后非空单元格：END, SHIFT+ 箭头键 将选定区域扩展到工作表上包含数据的最后一个单元格：END, SHIFT+HOME 将选定区域扩展到当前行中的最后一个单元格
image.png 安装组件 npm i ant-design-vue@next --save 引入组件 在main.js中全局引入组件。...babel-plugin-import -D然后在babel.config.js中如下配置： module.exports = { presets: [ '@vue/cli-plugin-babel...// 按需引入ant-design-vue组件库 import { Button, message, Tabs, Checkbox, Image, Upload } from 'ant-design-vue...n.sohucs.gif electron自定义无边框导航菜单 为了让项目UI更加美观，大家可以选择在创建窗口的时候去掉系统边框，自定义拖拽区域。...360截图20210226144549144.png p5.gif 大家需要准备两个大小一致的ico图标，其中一个透明即可，通过定时器来控制切换。
：应用带有两位小数、千位分隔符和减号 (-)（用于负值）的“数值”格式。 Ctrl+Shift+*：选择环绕活动单元格的当前区域（由空白行和空白列围起的数据区域）。...Ctrl+R：使用“向右填充”命令将选定范围最左边单元格的内容和格式复制到右边的单元格中。 Ctrl+S使用其当前文件名、位置和文件格式保存活动文件。 Ctrl+T显示“创建表”对话框。...按 Ctrl+箭头键可移动到工作表中当前数据区域的边缘。 按 Shift+箭头键可将单元格的选定范围扩大一个单元格。...在对话框中，按箭头键可在打开的下拉列表中的各个选项之间移动，或在一组选项的各个选项之间移动。 按向下键或 Alt+向下键可打开选定的下拉列表。 Tab 在工作表中向右移动一个单元格。...按 Ctrl+Shift+Page Up 可选择工作簿中的当前和上一个工作表。 Page Down 在工作表中下移一个屏幕。 按 Alt+Page Down 可在工作表中向右移动一个屏幕。
，性价比会很高，所以我们也采用了 UmiJS + ANT DESIGN PRO 的架构来进行项目升级（之前的老项目基于 Umi2.0 与 ANT DESIGN PRO 3.0 开发） UmiJS 是什么...然后配以生命周期完善的插件体系，覆盖从源码到构建产物的每个生命周期，支持各种功能扩展和业务需求。 ANT DESIGN PRO 是什么？...Ant Design Pro 是一个企业级中后台前端/设计解决方案，基于 Ant Design 的设计规范和基础组件的基础上，提炼出典型模板/业务组件/配套设计资源，进一步提升企业级中后台产品设计研发过程中的...自定义模块 删除全球化 一般来说，Ant Design Pro 的国际化在大部分团队意义不大，所以可以先删除，后期有需求再进行添加。...子应用的模板，将 Header 模块全部删除，保留侧边路由模块，所以子应用单独开发的时候，可以拥有自己最大的自定义性，可以独立开发。 ? 子应用在加载到主应用的时候，则如下图所示： ?
前后端分离架构 SpringBoot2.x，SpringCloud，Ant Design&Vue，Mybatis-plus，Shiro，JWT 支持微服务。...issues/I1PEB2 登录页面错别字issues/993 在线文档中不能支持对List的入参 issues/1246 online表单开发 填写表明时只要数据库中有一个库中存在这个表就会提示表名已存在...多表头导出，会多出一列空白列issues/1513 tinymce第一次打开正常,页面切换后再切换回来内容空白且无法编辑issues/1507 抽屉式界面下方有一点奇怪的显示issues/1532 头部菜单样式...issues/1749 菜单收缩为图标模式时,右侧区域滚动失效 issues/1932 通配符问题 issues/1952 sql server数据库，表存在判断方法有问题issues/1929 js增强附表内置方法调用问题...采用最新主流前后分离框架（SpringBoot+Mybatis-plus+Ant-Design+Vue），容易上手; 代码生成器依赖性低,灵活的扩展能力，可灵活实现二次开发; 开发效率很高,采用代码生成器
”命令（菜单栏中的工作簿图标菜单） CTRL+F8 运行“大小”命令（菜单栏中的工作簿图标菜单） CTRL+F9 将工作簿窗口最小化 CTRL+F10...（“格式”菜单的“工作表”子菜单上的“重命名”命令） Alt+EM 移动或复制当前工作表（“编辑”菜单上的“移动或复制工作表”命令） Alt+EL 删除当前工作表（“...编辑”菜单上的“删除工作表”命令） 6.10．工作表浏览快捷键 箭头键 向上、下、左或右移动一个单元格 Ctrl+箭头键 移动到当前数据区域的边缘 Home...End+Shift+Home 将选定区域扩展到工作表的最后一个使用的单元格（右下角） End+Shift+Enter 将选定区域扩展到当前行中的最后一个单元格。...如果选定单列中的单元格，则向上移动 Ctrl+句号 按顺时针方向移动到选定区域的下一个角 Ctrl+Alt+向右键 在不相邻的选定区域中，向右切换到下一个选定区域 Ctrl
”菜单上的“删除工作表”命令） 6.10．工作表浏览快捷键 箭头键 向上、下、左或右移动一个单元格 Ctrl+箭头键 移动到当前数据区域的边缘 Home 移动到行首 Ctrl+Home 移动到工作表的开头...Ctrl+End 移动到工作表的最后一个单元格，该单元格位于数据所占用的最右列的最下行中 Page Down 向下移动一屏 Page Up 向上移动一屏 Alt+Page Down 向右移动一屏...End+Shift+Home 将选定区域扩展到工作表的最后一个使用的单元格（右下角） End+Shift+Enter 将选定区域扩展到当前行中的最后一个单元格。...Tab 在选定区域中从左向右移动。...如果选定单列中的单元格，则向上移动 Ctrl+句号 按顺时针方向移动到选定区域的下一个角 Ctrl+Alt+向右键 在不相邻的选定区域中，向右切换到下一个选定区域 Ctrl+Alt+向左键 向左切换到下一个不相邻的选定区域
并且可以在 React、Vue、Angular 项目中使用 「Scroll Reveal」 零依赖，为 web 和移动浏览器提供了简单的滚动动画，以动画的方式显示滚动中的内容 「Kute.js」 一个强大高性能且可扩展的原生...排序，添加和删除 DOM 元素的 js 动画库 「Lottie」 一个用于 Android，iOS，Web 和 Windows 的库，用于解析使用 Bodymovin 导出为 json 的 Adobe...HTML5 canvas 元素的图片编辑器 「merge-images」 一个将多张图片合并成一张图的 js 插件 「cropperjs」 一款强大的图片裁切库, 支持灵活的图片裁切方式 「Grade...元素的 CSSku 库 hint.css 一个用纯 css 和 html 实现的提示库 React相关库 UI 库 Ant design 用于研发企业级中后台产品的 UI 组件库 Ant design...mobile 基于 Ant Design 设计体系的 React UI 移动端组件库 MaterialUI 世界最受欢迎的基于质感设计的 React UI 库 toolbox 一套使用 CSS 模块功能实现
Ant design 基于 Ant Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品 Ant design mobile 基于 Ant Design 设计体系的 React...UI 移动端组件库 MaterialUI 世界最受欢迎的基于质感设计的React UI库 React toolbox 一套使用CSS模块功能实现Google的Material Design规范的React...desktop 基于React的JavaScript库，旨在将本机桌面体验带入网络，其中包含许多macOS Sierra和Windows 10组件。...react-desktop与NW.js和Electron.js完美结合，但是可以在任何JavaScript驱动的项目中使用 Zent 有赞 PC 端 WebUI 规范的 React 实现，提供了一整套基础的...UI 组件以及一些常用的业务组件 react-icons 基于React封装的丰富的图标库 3.
在受保护的工作表上的非锁定单元格之间移动：Tab 3.在选定区域内移动 在选定区域内从上往下移动：Enter 在选定区域内从下往上移动：Shift+Enter 在选定区域中从左向右移动。...如果选定单列中的单元格，则向上移动：Shift+Tab 按顺时针方向移动到选定区域的下一个角：Ctrl+句号 在不相邻的选定区域中，向右切换到下一个选定区域：Ctrl+Alt+向右键 向左切换到下一个不相邻的选定区域...将选定区域扩展到与活动单元格在同一列或同一行的最后一个非空单元格：End+Shift+箭头键 将选定区域扩展到工作表的最后一个使用的单元格（右下角）：End+Shift+Home 将选定区域扩展到当前行中的最后一个单元格...输入并计算公式 键入公式：=（等号） 关闭单元格的编辑状态后，将插入点移动到编辑栏内：F2 在编辑栏内，向左删除一个字符：Backspace 在单元格或编辑栏中完成单元格输入：Enter 将公式作为数组公式输入...Up 移动到首记录：Ctrl+Page Up 移动到字段的开头或末尾：Home或End 将选定区域扩展到字段的末尾：Shift+End 将选定区域扩展到字段的开头：Shift+Home 在字段内向左或向右移动一个字符
// babel-plugin-import 会帮助你加载 JS 和 CSS import { DatePicker } from 'antd-mobile'; Ant Design Mobile RN...在react-native中使用Ant-Design yarn add @ant-design/react-native 在babel配置中: "plugins": [ ["import",...Js与Java通信机制 Java与Js之间的调用，是以两边存在两边存在同一份模块配置表，最终均是将调用转化为{moduleID,methodID，callbackID，args}，处理端在模块配置表里查找注册的模块与方法并调用...Java 调用Js Java通过注册表调用到CatalystInstance实例，透过ReactBridge的jni，调用到Onload.cpp中的callFunction，最后通过javascriptCore...｛moduleID,methodID｝等数据存在MessageQueue中，等待Java的事件触发，把MessageQueue中的｛moduleID,methodID｝返回给Java，再根据模块注册表找到相应模块处理
地址，欢迎 star 3.2.2技术栈 dva+umi+ant-design-pro dva:可拔插的react应用框架,基于react和redux mui:集成react的router和redux...ant-design-pro:基于react和ant-pc的中后台解决方案 3.2.3适配方案 左侧固定宽度，右侧自适应 右侧导航分别配置滚动条.控制整个page 3.2.4技能点分析 技能点 对应api...本文从后台利用node的框架koa+mongodb实现数据的增删改查和注册接口，前端利用umi + dva +ant-design-pro来实现数据渲染。...// 表目录（数据模型） │ │ ├── course.js // 课程表 │ │ └── user.js // 用户表 │ └── utils...里面修改 7.6 koa的主要API API 作用 new koa() 得到koa实例 use koa的属性,添加中间件 context 将 node 的 request 和 response 对象封装到单个对象中
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
云直播
