组件库
文章平均质量分 93
归来巨星
一名致力于新技术的推广与优秀技术的普及的前端开发工程师。个人开源项目:TinkerBell-ui,TinkerBell-ui-react,TinkerBell-ui-next,react_ruoyi_admin,Tinkerbell-Blog等。
展开
-
dumi 如何使用?一文教你使用,高效写出你的博客、组件库文档
关于对dumi的介绍我们就可以简单的理解为快速开发文档的一种便捷开发工具,里面囊括了多种配置,我们不需要再去手动的编写组件这种,所以为我们开发组件库文档,官方文档,个人博客介绍这种网站提供了很便捷的帮助。有兴趣的同学也可以去看下这套手搭组件库文档,满满的😭血泪史😭。现在dumi推出了2的版本,当然我们在这里已经引入了dumi1的版本,所以此文我们针对dumi1进行简单介绍,2的版本,我们在后续的升级中会有所体现,文档地址参照如下。dumi1官方文档✨ 每天创作一点点✨ 开心快乐一整天。原创 2022-12-09 14:06:39 · 6925 阅读 · 1 评论 -
如何使用 markdown 结合组件 props 实现可控制的响应式 ui组件库 文档
✨ 每天创作一点点✨ 开心快乐一整天✨ 美好一天又一天。原创 2022-10-24 09:04:24 · 1109 阅读 · 0 评论 -
React造轮子(reacthook实现一套自己的组件库)轮子公开课——第六课【Checkbox、CheckboxGroup】组件
有兴趣的同学可以先着手看源码,之前写的一系列开源组件库项目(有帮助的同学也帮忙点个star👍)名称官网githubhttphttps—https—https✨每天创作一点点✨开心快乐一整天✨美好一天又一天httpshttpshttps。...原创 2022-07-25 14:04:50 · 1335 阅读 · 0 评论 -
React造轮子(reacthook实现一套自己的组件库)轮子公开课——第五课【Radio、RadioButton、RadioGroup】组件
手动实现一个前端 radio 组件,原来实现一个radio组件这么简单原创 2022-07-14 10:43:43 · 1325 阅读 · 15 评论 -
React-Hook 轮子公开课(从零开始)用最基础的方式写出一个简单的组件库——第四课【Link】文字链接组件
有兴趣的同学 可以先着手看源码,之前写的一系列开源组件库项目(有帮助的同学也帮忙点个star👍)其实谈到文本链接组件,我们可以参考向element、antd这些其实可以把这些看成是一个个的文字按钮组件,只不过底层就是使用a标签去实现的,又或者,我不想让其拥有a标签的href属性的话,底层完全就可以使用span标签来包裹文本,总的来说其实就相当于对文本进行了一个封装,我们可以通过属性进行判断到底是一个链接组件,还是一个单纯类似按钮功能的文本样式组件,简单的来讲我们只需要对其进行一个颜色封装即可,当然主要的也.原创 2022-07-12 15:16:42 · 456 阅读 · 10 评论 -
React-Hook 轮子公开课(从零开始)用最基础的方式写出一个简单的组件库——第三课【Row、Col】布局组件
有兴趣的同学 可以先着手看源码,之前写的一系列开源组件库项目(有帮助的同学也帮忙点个star👍)想到布局组件,其实我们最先想到的也就是栅栏,最早接触前端的时候、或者最早接触ui组件的时候,我们首先是不是就先想起来了 Bootstrap 里面的栅栏呢?其实功能类似,底层的话采用的是什么功能呢?也就是@media媒体查询,利用的其实也就是浏览器的分辨率监听,实现了对应的class样式变更,从而达到了一个分割布局的这么一个效果,主要也是捋清我们怎样去写这个代码:3.2、Row / index.scss3..原创 2022-07-12 14:17:42 · 1483 阅读 · 5 评论 -
React-Hook 轮子公开课(从零开始)用最基础的方式写出一个简单的组件库——第二课【Button】组件
有兴趣的同学 可以先着手看源码,之前写的一系列开源组件库项目(有帮助的同学也帮忙点个star👍)提到 button 组件,这几乎可以说是一个组件库中的重中之重,基本上很多的时候我们都需要用到 button 来进行一系列的 dom 操作,时间执行,用户与浏览器之间进行交互不免得就少不了 button 按钮,那么我们先捋清楚一个思路这个 button 该怎么去写?3.2、index.scss3.3、variables.scss(这里的文本样式是参考的 bin-ui )四、效果呈现至此效果实现当然.原创 2022-06-29 11:14:23 · 598 阅读 · 10 评论 -
React-Hook 轮子公开课(从零开始)用最基础的方式写出一个简单的组件库——第一课【Icon】组件
React-Hook 轮子公开课(从零开始)用最基础的方式写出一个简单的组件库——第一课【Icon】组件>>>关于组件库的话,有关注到我的朋友大家其实也都清除,我这边其实在之前也有讲解过,零零散散的记录过一些有关于组件疑惑点、像正常我们去开发一个项目,类似现在直接用一些的 js 框架,很自然就忽略掉了一些问题点.........原创 2022-06-08 16:27:46 · 727 阅读 · 3 评论 -
(扩展 vue 思维)使用 React 构建一个轮子(LoadingBar加载组件)让 useState 挂载 ref 实例,函数外部 js 调用实例 ref.useState 实现子组件更新
文章目录一、组件概述、使用场景描述(Vue2版本)1、思维,及实现方式描述2、main.vue3、index.js二、组件构思(react版本)1、思考如何挂载组件问题2、函数式编程,其中没有类的概念,没有this,如何在外部调用实例方法?3、使用 React.createRef() 获取一个ref实例4、index.tsx5、index.scss6、引入调用及功能实现一、组件概述、使用场景描述(Vue2版本)1、思维,及实现方式描述先上一个图,这边的ui库是我这边之前使用vue2版本构建的一个组件原创 2022-03-23 14:14:54 · 2067 阅读 · 21 评论