vue2

2023-07-04 90 阅读2分钟

项目结构

编辑

模板语法（在标签之外）

插值语法 ：双大括号

属性绑定（在标签之内）

v-bind:

单属性两种写法

编辑

多属性绑定

编辑

条件渲染

编辑

编辑

列表渲染

要有key，降低消耗

遍历数组

编辑遍历对象

编辑

事件处理

编辑

传递参数

编辑事件修饰符

编辑

编辑

数组监听（后续研究）

编辑（当数组方法不会产生新数组，自己替换新数组来实现数组监听）编辑

编辑

计算属性

编辑

编辑

编辑计算属性只有一次，方法每次都会调用

监听属性

编辑

class绑定

编辑

编辑

编辑

style绑定

编辑

编辑

表单绑定

编辑

模板操作

编辑

编辑

组件

局部引用

编辑全局引用（在main中）编辑

数据传递

props（父传子）

子添加props属性

编辑

传参校验

类型

编辑

默认值

编辑

必须选性

编辑

组件事件（子传父）

触发自定义事件类型

编辑

编辑

编辑

传递函数（子传父）

父元素向子元素传递函数，子元素调用函数来更改父元素的数据，实现子传父

父

编辑

子

编辑

插槽

组件嵌套过程中，父组件内部向子元素插入其他东西。

编辑

编辑编辑

具名插槽

编辑

编辑

编辑

动态组件

编辑保持活性

编辑

编辑

异步组件（懒加载）

编辑

依赖注入（参数透传）

祖宗

编辑

子（类似props）

编辑

路由

懒加载

通过箭头函数实现懒加载

编辑

编辑

编辑

Vuex

Vue有五个核心概念，state, getters, mutations, actions, modules。

state => 基本数据
getters => 从基本数据派生的数据
mutations => 提交更改数据的方法，同步！
actions => 像一个装饰器，包裹mutations，使之可以异步。
modules => 模块化Vuex

编辑

编辑

编辑

Getters

编辑

Mutation

编辑 Actions

编辑