系统性学习vue-vue核心

做了三年前端,但很多系统性的知识没有学习
还是从头系统学习一遍吧
课程是b站的Vue2.0+Vue3.0课程

后续还会学习的如下,就重新开一篇了,不然太长,之后放链接
vue组件化编程
vue-cli 脚手架
vue中的ajax
vue-router
vuex
element-ui
vue3

老师推荐的vscode针对vue的插件:
Vue 3 Snippets by hollowtree 代码提示
Vetur by Pine Wu

vue核心

  • vue基础
    • vue是什么
    • 谁开发的
    • vue特点
    • 官网内容
    • 开始vue
      • 引入vue
      • 安装vue-devtool
      • vue全局配置
      • 本地服务 强制刷新
      • 使用vue
    • 模板语法
      • 插值语法
      • 指令语法
    • 数据绑定
    • el与data的两种写法
    • 理解MVVM模型
    • 数据代理
      • Object.defineProperty
      • 数据代理
    • 事件处理
      • 事件基本使用
      • 事件修饰符
      • 键盘事件
    • 计算属性
      • 计算属性简写
    • 监视/监听/侦听属性
      • 监视属性
      • 深度监视
      • 简写形式
      • 监视属性与计算属性对比
    • 绑定样式
      • 绑定class样式--字符串写法
      • 绑定class样式--数组写法
      • 绑定class样式--对象写法
      • 绑定style样式(不常用)
    • 条件渲染
    • 列表渲染
      • key作用与原理
      • 列表过滤
      • 更新时的一个问题
        • Vue监测数据变化
        • Vue.set的使用
        • 解答
        • 总结-Vue监视数据的原理
    • 收集表单数据
    • 过滤器
    • 内置指令
      • v-text
      • v-html
        • cookie
      • v-cloak
      • v-once
      • v-pre
    • 自定义指令
    • 生命周期
  • 小技巧
    • VSCode
    • 浏览器
    • 其他
  • 小知识

vue基础

vue是什么

  • 一套用于构建用户界面的渐进式JavaScript框架

渐进式: vue可以自底向上逐层的应用
就是既可以简单应用(只需一个轻量小巧的核心库,大约100kb),也可以进行复杂应用(可以引入格式各样的vue插件)

谁开发的

尤雨溪(搜狗竟然没有关联!)
使用了React后又使用Angular,2013年受到Angular启发进行了相对轻量的框架开发

vue特点

  • 采用组件化模式,提高代码复用率,且让代码更好维护. 高内聚,低耦合
  • 声明式编码,让编码人员无需直接操作DOM,提高开发效率, 如下例
    命令式编码 则是需要将每条数据进行字符串拼接,再通过复制进行显示
<ul id="list">
	<li v-for="p in persons">
		{{p.id}} - {{p.name}} - {{p.age}}
	li>
ul>
//数据
var persons = [
	{id:"1",name:"张三",age:"10"},
	{id:"2",name:"李四",age:"2"},
	{id:"2",name:"王五",age:"42"},
]
  • 使用虚拟DOM+优秀的DIff算法,尽量复用DOM节点
    就是数据更新,先在虚拟DOM中通过Diff算法进行比较,最后在真实DOM进行差异更新

官网内容

Vue2官网
[资源列表-Awsome Vue] 罗列了使用vue开发的第三方库,如echart
Vue3官网

开始vue

引入vue

  • 直接用

你可能感兴趣的:(vue.js)