![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
极简系列
文章平均质量分 81
勤学daydayup
good good study, day day up
展开
-
极简系列---vue3.x表单组件form
本文从零开始实现一个自定义的vue3.x表单组件ti-form,组件使用体验类似element-ui。完整代码地址:https://github.com/littleluckly/vue3.x-components-study实现过程涉及到的知识点setup函数,用法参考:https://v3.cn.vuejs.org/guide/composition-api-setup.htmltoRefsrefreactivev-model事件订阅派发,采用第三方库mitt,用法参考https:/原创 2021-08-01 16:17:21 · 1914 阅读 · 0 评论 -
极简系列---vue2.x表单组件form
文章目录my-form框架my-form-item框架my-form-item组件校验my-form组件校验broadcast事件广播my-input组件dispatch事件派发毛坯房验收本文从零开始实现一个自定义的vue2.x表单组件my-form,组件使用体验类似element-ui实现过程涉及到的知识点自定义事件事件的广播与派发v-mode语法糖原理$attrs,参考https://cn.vuejs.org/v2/api/#vm-attrsprovide/inject传递数据,参考原创 2021-07-26 23:27:23 · 765 阅读 · 0 评论 -
极简系列---vue2.x消息组件message
实现一个小小目标---极简版的messge消息组件- 支持多种调用方式 1. 组件内`this.$message`方式调用 2. 在`.js`文件中作为一个函数独立使用- 支持手动关闭message原创 2021-07-27 21:19:14 · 2730 阅读 · 0 评论 -
极简系列---vue 响应式实现(2.x)
用过vue的同学想必都知道它是基于Object.defineProperty实现的响应式,那么具体是怎么做到呢,下面我将用不到一百行代码逐步拆解响应式原理关于defineProperty可参考MDN拦截对象属性的存储行为新建一个文件my-vue.js,在内部定义一个方法defineReactive,在方法内通过Object.defineProperty拦截对象属性的操作// my-vue.jsfunction defineReactive(obj, key) { let value = o.原创 2021-07-17 15:28:26 · 132 阅读 · 0 评论 -
极简系列---vuex实现
开篇废话:想必每一个使用过vue技术栈进行开发的同学都知道vuex是一个全局状态管理库,其使用方法非常简单。作为一名开发人员我们要知其然,也要知其所以然,但是阅读源码却是一块非常难啃的骨头,看着看着就容易陷入从入门到放弃的过程。为了那些想看源码又不知如何下手的同学,我现在用几十行代码来详细讲解如何实现vuex核心简单需求分析回顾下vuex的初始化方式Vue.use(Vuex); const store = new Vuex.Store({xxxxx}); const app = new Vue(.原创 2021-07-15 22:24:08 · 194 阅读 · 0 评论