vue
2022-02-28 17:25:32 11 举报AI智能生成
登录查看完整内容
vue脑图学习
作者其他创作
大纲/内容
数据<--驱动-->视图
hello world
MVVM 响应式
框架概念
v-bind:href="url"
Class 与 Style 绑定
v-bind:
v-once
v-if=“ ”条件渲染
数组变动
v-for="todo in todos" 列表渲染
超链接
v-on:
v-model="xxxx(data)" 表单控件
v-xxx: 指令
{{ msg }} 插值
过滤器
模板
计算属性的函数就是 vm.reversedMessage 的 getter
vm.reversedMessage 依赖于 vm.message
性能好，缓存
getter(默认的) setter（需要手动添加）
计算属性 computed 基于普通属性
作用：响应数据的变化
watch
jsx
函数化组件--- 无状态（没有 data），无实例（没有 this 上下文）
render函数
实例
语法
beforeCreate
created
beforeMount
mounted
beforeUpdate
updated
beforeDestroy
destroyed
钩子函数
this 指的是这个实例 this.xxx(data，methods，computed，watch)
组件中的data必须是函数
全局注册 局部注册
验证
props 父子通信·
空vue实例 pub-sub模式
vuex
非父子组件通信
非具名
具名
作用域插槽
<slot>插槽 存在于子组件的模板中
组件之间的组合
<component v-bind:is="currentView"> 元素
<keep-alive> 包裹<component>组件，开启缓存
组件之间的切换
可加在组件或dom元素上
索引 ref
异步加载组件
.vue文件 单文件的组件
组件---vue实例
Redux binding for Vue
用一个全局单例模式管理状态（数据）
vuex--借鉴了 Flux、Redux、和 The Elm Architecture
状态管理
vue-router库
简单切换
路由
Object.defineProperty 把对象各属性转为 getter/setter
Vue 不允许在已经创建的实例上动态添加新的根级响应式属性
必须在初始化实例前声明根级响应式属性，哪怕只是一个空值
vm.$nextTick(callback)
确保dom更新后再执行其他动作
响应式原理
v-on:increment="incrementTotal" 绑定自定义事件
parent
$on(eventName) 监听事件
this.$emit('increment')
child
$emit(eventName) 触发事件
vue
0 条评论
回复 删除
下一页
