- 博客(10)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 Vue3从0到1组件开发-基础组件：BackTop回顶
基础组件最后一件：Backtop回到顶部的野望谈及前端开发中的基础交互，必不可少的一个功能应该就是回到顶部了吧，但是Backtop回到顶部功能应该也是网页中最不起眼的一个功能了，这句话没争议吧。在我为数不多的开发经验当中，看过好几款不同的回到顶部，如瞬间回到顶部，滚动回顶顶部，定时回到顶部这几种算是比较常见的了，其中尤以瞬回,滚回这两种方式最为常见，而定时回顶则相对少一些，实现略微有点复杂，收益也不大，也就是传说中的付出大于回报。当然这些都是看个人意愿，而在常规的Web项目开发中，回到顶部大概是必
2021-08-08 00:44:15
310
原创 Vue3从0到1组件开发-基础组件：Link
Link: 你为何而来？Link也需要写吗？就Link链接这个组件的作用来写，确实稍微有一丢丢的不是很有必要，可以说是和HTML默认的a标签完全无二致了，强行解释一波也只能搬出主题、是否禁用、自定义下划线等几个封装之后的小特色了。不过在完善了这个组件之后，还是觉得可以写一些的，虽然是很简单，甚至不是很有存在价值的一个组件，但是也算是组件库中的一员嘛。不过想了想，参考了市面上其他几个，以及仔细研究了掘金网站（因为我的个人项目是仿掘金的）之后，我还是决定搞他一下，原因在于好几个地方会出现带图标链接，图.
2021-08-07 10:56:30
519
原创 Vue3从0到1组件开发-基础组件：Icon图标库
theme: smartblue这是我参与8月更文挑战的第6天，活动详情查看：8月更文挑战必不可少：图标库它真的必须吗？21世纪已经过去了20年了，前端也已经发展了20多年了，随着用户的审美越来越高，对用户体验的要求也越来越高，我想已经很少在主流网站中找到一个不用图标的网站了吧？而最开始的图标多以图片为主，后为了优化、减少请求有了雪碧图的概念，但它仍然是图片，图片的加载始终是较慢的。之后有了svg，才终于好了一点，但是也使用起来也并不方便，零零散散的。而随着阿某推出iconfont网站之后，字.
2021-08-06 00:11:34
1338
原创 Vue3从0到1组件开发-基础组件：Mask
Mask：不要不在乎遮罩Why is mask?在一个完整的组件库中，抽出Mask作为一个单独的组件仍然是可有可无的一种处理方法。而将Mask暴露给开发者使用的似乎更少，多见于主攻移动端的UI库当中，如Vant、uniapp(下载插件) 等，而在主攻Web端的UI库当中则及其少见。当然也是因为Web端很少功能需要用到这类的组件。此处所指的"完整的组件库"指能满足一个项目的基本功能需求的组件库。但是在我所设想的组件库当中还是把它作为一个单独的组件库来开发，其中之一的原因在于我想把我的项目兼容移动端
2021-08-05 00:53:47
577
原创 Vue3从0到1组件开发-基础组件：Button
基础组件： Button前言从这里开始，系列就正式进入到组件开发了，按照前文关于组件分类的描述，我们将从基础组件开始，一步步搭建起一个项目组件库在系列的最后，将阐述如何从项目中抽出组件，打包成一个独立的组件库。基础组件当中，最常用也最不起眼的当属Button、Mask这些常常作为绿叶的组件了。而本系列既然是从0到1去写，那么自然先从简单的开始，红花艳不艳，就看绿叶靓不靓了。那么为什么从Button开始，而不从看起来更简单的Mask开始呢？自然是有原因的？待明日更新了Mask的文章，就知道
2021-08-04 08:34:21
598
原创 Vue3从0到1开发组件前戏（下）：组件分类
本专栏的组件大分类前言这篇文章将是Vue3从0到1开发组件的最后一篇铺垫文章。在这里，主要是铺垫一下在这个系列当中，我定义的几个组件的大分类。另外提一句，在该系列中，并非单纯的去学习、分享如何从0到1的开发一个组件，同时也会拓展分享一下，在我的个人项目中，我是如何应用这些组件的。因为我预期的组件库会作为一个独立的项目进行开源，所以会基于自己开发的这个通用组件库进行组件的二次封装。那么这在我对组件库和项目的构思中，就产生了几个冲突点。是的，组件库还没开发完，我没法给自己打广告了，但是不要紧，分
2021-08-03 08:28:07
175
1
原创 Vue3从0到1开发组件前戏（中）：$emit,$on,$off替代方案
本系列中会用到的第三方库一、起因上一篇文章中说过，在Vue的新版本，Vue3中删除了$on,$once,$off等方法，$emit仍然是现有 API 的一部分，因为它用于触发由父组件以声明方式附加的事件处理程序。但是既然是组件开发，那么组件与组件之间的通信，组件与父级之间的通信肯定是少不了的，$emit方法虽然已经能满足半数以上的通信需求，但是剩下满足不了的部分，就是满足不了。所以就要用到市面上的第三方库来作为平替方案了。Vue3迁移文档中提及:在 Vue 3 中，已经不可能使用这些 API 从组件
2021-08-02 08:19:35
1997
原创 Vue3从0到1开发组件前戏（上）：one piece
Vue3 代号：One Piece零、前言专栏开篇，先用三篇文章做个铺垫，将一些重要的基调铺下。此外，这个系列，这个专栏并不是面向完全的新手的，但是我可以立个flag，只要是度过了Vue的入门期，无论是Vue2还是Vue3，都可以不费力的理解我要讲的内容。三篇文章讲分别分享三个重要的内容：1、即本文，主要阐述，在开发组件这一块，Vue3对比Vue2在开发组件需要的功能上一些区别2、分享一下因为Vue3删除了几个重要的API，而引用的一个库作为平替方案。3、本人对组件总结的几个大分类，也是接下
2021-08-01 10:56:04
382
1
原创 vue+element-ui backtop组件使用
element-ui中的backtop返回顶部组件的使用最近写的项目中用到了vue和element-ui实现前端页面，在最后写到返回顶部的时候，看到有自带的组件就直接使用了，但是在copy代码进去之后发现没生效。找了不少文章，有些是直接copy了官方的文档，有的是给出了 解决方案，但是没有说明，有点看不懂到底要怎么弄。最后的最后，我差点就自己写原生。 最终因为懒就没有自己写。所以我仔细观察...
2019-12-17 20:53:01
2143
1
原创 Vue-cli3中优雅的使用Swiper库创建轮播
在使用swiper创建轮播前，需要先知道一件事，原生代码可以直接使用swiper库。但是在Vue-CLI中使用的是vue-awesome-swiper插件，以下只介绍vue脚手架中使用swiper，所以文章中的swiper特指vue-awesome-swiper。在vue-cli2中引入swiper// vue-cli2 中通过npm安装npm install vue-awesome-s...
2019-12-13 15:40:04
2385
3
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人