金色小芝麻

vuePress-theme-reco 金色小芝麻    2021 - 2023
金色小芝麻 金色小芝麻

Choose mode

  • dark
  • auto
  • light
主页
分类
  • JavaScript
  • BUG复盘
  • SVG笔记
  • TypeScript
  • 个人总结
  • CSS笔记
  • 开发工具
  • 前端入门
  • Vue2.0
  • 性能优化
  • 架构学习
  • 每日一题
标签
时间轴
社交
  • 掘金 (opens new window)
author-avatar

金色小芝麻

83

文章

27

标签

主页
分类
  • JavaScript
  • BUG复盘
  • SVG笔记
  • TypeScript
  • 个人总结
  • CSS笔记
  • 开发工具
  • 前端入门
  • Vue2.0
  • 性能优化
  • 架构学习
  • 每日一题
标签
时间轴
社交
  • 掘金 (opens new window)
  • 前端入门

    • 博客搭建过程及相关配置
    • 数组中的16种常用方法
    • JS中的数据类型简析——基本数据类型值
    • JS中的数据类型object基础
    • JS中三种常见的判断
    • 数据类型之间的区别(堆内存Heap VS 栈内存Stack)
    • JS基础练习题及解析
    • 开关灯的小案例
    • JS中数据类型检测方法——typeof
    • 条件判断几个小练习
    • JS循环——for循环
    • 自定义属性实现选项卡小案例
    • 字符串中的12种常用方法
    • DOM操作的简单原理
    • JS实现隔行变色鼠标跟随小案例
    • JS中function的基础知识
    • JS中数组去重的三种方法
    • JS中时间格式化的三种方法
    • JS中URL参数处理的三种方法
    • JS小案例——获取随机验证码
    • DOM操作之——获取DOM标签的9种方式
    • DOM操作之——DOM节点类型及属性
    • DOM操作之——元素的增删改、样式修改、插入内容
    • JS中THIS相关问题梳理
    • JS中的变量提升机制
    • 在全局:私有上下文中:带VAR和不带VAR的区别
    • 作用域和作用域链查找机制
    • JS中堆栈内存的释放问题
    • JS中的闭包机制
    • ES3和ES6定义变量的区别
    • JS中的单例和工厂设计模式
    • JS中的面向对象OOP理论基础
    • 构造函数创建自定义类
    • JS中的原型和原型链
    • Math中常用的9种方法
    • 从一道阿里经典面试题剖析函数三种角色
    • 重写内置call
    • 重写一个内置new
    • 浏览器渲染页面的主体流程
    • 减少DOM的回流和重绘
    • JS中的多种继承方式
    • JS中数据类型检测四种方式的优缺点
    • JS中的正则表达式&&全面梳理
    • 非严格模式 🆚 严格模式的区别
    • 数组方法reduce、filter、flat
    • 获取数组中最大值/最小值的三种基础方法
    • 轮播图——渐隐渐显版
    • 深克隆 VS 浅克隆|深比较 VS 浅比较|回调函数
    • 轮播图——左右切换版
    • 事件及事件绑定、事件对象及事件传播
    • 从在地址栏输入网址到看到页面的过程&&AJAX基础
    • 想自学JS吗?想提升JS底层原理吗?76张脑图带你彻底搞懂原生JS
    • 面试手写API系列
    • 30张脑图带你从零开始学VUE
    • JS中的盒子模型
    • 初识JS-基础中的基础
    • 前端发展简史
    • JS中的三大类输出方式

30张脑图带你从零开始学VUE

vuePress-theme-reco 金色小芝麻    2021 - 2023

30张脑图带你从零开始学VUE

金色小芝麻 2020-08-01

"不畏惧,不讲究,未来的日子好好努力"——大家好!我是小芝麻😄

首先感谢大家对小芝麻上一篇《想自学JS吗?想提升JS底层原理吗?76张脑图带你彻底搞懂原生JS》的支持和认可🙏,,其次是感谢大家的包容和鼓励;

特别、特别、特别感谢!!!

另外笔者也成功升到了3级😄 ;既然大家都没什么要求,那本芝麻就偷偷的当作什么都没发生过了(就这么没有节操。。哈哈哈哈)

今天小芝麻想分享的是VUE的基础,之所以没有按照专门的模块单独写文章,是因为小芝麻觉得:

  • 1、尤大大的API近乎完美
  • 2、很多大神的文章通俗易懂且透彻,各个网站都很有很多;
  • 3、小芝麻的水平实在有限,不及大家,所以就不献丑了;

每个人都有自己的学习方式,画图可能就是小芝麻觉得最舒服,和收获最大的方式;所以本篇还是给大家分享一下思维导图,如果您刚好能收获一二,那是小芝麻荣幸😄 能帮到您查缺补漏;

本篇内容适用于:初学前端;及工作时间不久想回顾基础的各位伙伴;

这次先上图片链接地址: (opens new window) https://gitee.com/jinsexiaozhima/juejin/tree/master/Mindmap/

# 0、模块化进化史

# 1、VUE初识

# 2、VUE的基础语法

# 3、VUE的常用指令1

# 4、VUE的常用指令if/show/model

# 5、VUE中的常用事件处理

# 6、filter过滤器方法

# 7、computed 计算属性

# 8、watch 监听器

# 9、双向数据绑定的原理

# 9.1、数据驱动视图的原理

# 9.2、Object.defineProperty()

# 9.3、proxy()

# 9.4、视图驱动数据的原理

# 10、class和style动态绑定

# 11、VUE 生命周期函数

对照下面API图解

# 12、VUE 中的组件基础

# 13、VUE 组件中的slot插槽

# 14、组件信息通讯

# 14.1、父传子——props属性传递

# 14.1.1单项数据流

# 14.2、子改父——发布订阅方式

# 14.3、EventBus

# 14.4、祖先与后代——provide和inject

# 14.5、ref/parent/children

# 15、VUEX基础及使用

# 16、VUE-CLI基础及使用

# 16.1、VUE-CLI 创建项目

# 16.2、VUE-CLI 文档目录

# 16.3、VUE-CLI 进阶处理

# 17、VUE-ROUTER 基础概括

# 18、VUE-ROUTER 实现路由跳转

小芝麻觉得,框架的学习主要是多练习,多敲代码,基础知识只是学好框架的一个门槛,如果让笔者分配百分比的话,可能只会给他分10%左右吧;

以上均是本芝麻个人总结和见解,如有出入还请各位大神赐教,不胜感激

️

欢迎来到 金色小芝麻
看板娘