material ui

以React表单库Formik为例谈优秀的三方库应该是什么样的

為{幸葍}努か 提交于 2020-12-24 16:28:32
最近重刷了一下React官方文档 关于表单的内容 ,在结尾处,官方讨论成熟的react社区表单库时 钦点 了Formik,引起了我的注意。 If you’re looking for a complete solution including validation, keeping track of the visited fields, and handling form submission, Formik is one of the popular choices React官方钦点库,不学留着当寒假作业吗? 通读了一遍 Formik 的官方文档 ,上手在项目中试用了一下,大喜! —— ”这个表单库也太优秀了吧!“ 我个人认为优秀的第三方库需要符合四个标准,Formik都完美地满足了。 一,友好的文档 Formik 的官方文档 的友好程度简直让人惊喜。 首先是 overview 简要阐述了Formik作者的创作动机,基本的安装流程,还有 hello world的试玩环境(playground),以及几段基础的示例代码 但是更令我惊喜的是第二章 tutorial 。这一章,以创建一个完整且复杂的 新闻订阅注册表单 为例,一步步地“手把手”地教读者使用 Formik。由最基础的表单功能,到验证功能,到只追踪 修改过的项;接着,又以优化代码(减少样板代码)为由进一步介绍了

一个由Tooltip引发的 React Ref 讨论

别说谁变了你拦得住时间么 提交于 2020-12-24 15:03:57
Tooltip 大家应该都知道,就是我们常见的 当用户移动鼠标悬浮在 按钮 时会跳出显示的小文字框,比如知乎网页编辑器上的各类图标按钮都设置了 Tooltip 最近在使用 Material-UI Tooltip 时遇到到了个小问题,牵扯出了一系列关于 React Ref 的问题和思考,在本文分享给读者们。 出问题的代码如下 <Tooltip title="hi zhihu"> <FunctionComponent/> </Tooltip> 原意是希望在一个函数组件的周围显示一个简单的Tooltip 但是不仅没有成功显示,还在 console 里报出了以下warning log Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()? 里面显示了2个信息: Function components cannot be given refs 函数组件不能使用 ref React.forwardRef() 提示使用这个方法 可是,这几行代码里并没有看到 ref 啊 在直接看 Tooltip 源码前,我先去看了文档 https:// material-ui.com/compone nts

哪些UI库支持暗模式?

北城以北 提交于 2020-08-10 15:44:09
如今,黑暗模式是Web,桌面和移动应用程序中经常需要使用的功能。 通过增加可定制的界面来提高开发者对UI库的使用体验是非常重要的,可以带动很多开发者使用特定的UI库。 以下是一些支持暗模式的已知UI库。 Material UI React JS的Material Design UI框架在GitHub上拥有超过57,000个星标,具有简单,面向开发人员和可扩展的主题功能。它基于著名的CSS-in-JS,使开发人员可以在与同一基本概念相关的三种不同样式API之间进行选择。 任何熟悉Material UI的开发人员都可以证明其主题和调色板管理功能是生态系统中最好的。 根据主题化文档,我们可以很容易地在基本material UI应用程序上添加暗色主题。 此外,当我们访问文档时,我们可以切换明/暗模式和切换调色板,以帮助可视化所有提供的素材组件与不同的主题。 Vuetify Vuetify在GitHub上拥有25k颗星,是Vue中非常流行的UI框架。 它非常有名,因为它充分利用了Vue API。在Vuetify上,主题系统构建得非常好。给你的web应用一个黑暗主题是非常容易的。 Vuetify支持Material Design规范的浅色和深色版本。 这种指定从根程序组件 v-app 开始,并得到大多数组件的支持。默认情况下,你的应用程序将使用浅色主题

设计资源大全

自作多情 提交于 2020-04-29 08:53:12
设计资源大全 GitHub 主页: https://github.com/jobbole/awesome-design-cn 本项目的参与者 ㄨiaǒ偉、shanlijie001、rose、梦熙、布洛、 注:名单不分排名,不定期补充更新 目录 ICON图标 Fontello :图标字体生成器 The Noun Project :免费提供高度可辨识符号图标 IconArchive :专业图标搜索引擎 iConify :Mac平台的苹果应用图标自动化生成工具 Iconbench :在线ICON素材图标制作工具 EasyIcon :免费图标搜索和下载平台 Icon Deposit :一个奇妙的图标下载站 jobbole/awesome-design-cn · GitHub Logo 设计 Logaster :教你在线几分钟内搞定专业的LOGO设计 LogoLounge :国际知名的LOGO设计权威网站 LogoMoose :一个优秀的logo素材站点 LogoPond :LOGO设计作品收藏网 BRAND NEW :资源丰富的Logo设计网站 LOGOED :一个展示Logo设计的博客 LOGOSPIRE :logo设计的交流平台 Logo of the Day :汇集世界各地优秀LOGO作品的站点 LogoDesignLove :Logo设计技巧分享网 Brandseen