vue知识基础

vue知识基础

mvc

#父子传值

#标签

#子组件

#全局的vue

#传值

#数组

通过下标方式修改数组 不会同步 必须

Pop push shift unshift splice sort reverse

#对象

直接新增属性 不会同步 可以通过重新赋值的方式来改变

#is

table 下 只能跟 tr 否则渲染出错！

#组件类型约束

#简单校验

要求是数字或者是字符串

#复杂校验

#props

#props特性

子组件内定义了 props属性 同时子组件中不会显示 content=”123” 内容

#非props特性

子组件内没有定义 props属性，那么 父组件中 “123”值将会 直接渲染在子标签上

子组件多了 一个content属性

#组件事件

#监听组件原生事件

修饰符 @event.native

#递归组件

#非父子组件传值

Bus 总线 订阅 观察者模式

#插槽

#默认值

可以默认值

#指定slot

可以指定 name 和 slot 

#作用域插槽

#父组件

应用场景：子组件的渲染样式由外部决定。

Template 固定写法 必须声明 slot-scope=”随便”

#子组件

#动态组件

#component

Component就是动态组件 is等于谁就显示谁 type是变量 组件名 

#v-once

v-once 创建一次之后，存放在了内存中，反复切换显示时，效率更高

#动画

#进入

#离开

#自定义动画class名

#使用animate.css

#一出场就有动画

appear 是个关键字

type是个关键字

duration

#js方式实现动画

#入场动画

#出场动画

#第三方动画库 velocity.js

#多个元素使用动画

Key为关键字 一定要填写，否则 vue 自己会复用两个div

mode 关键字 一个元素显示完毕后，再隐藏

相反

#多个组件使用动画

#动态组件使用动画

#transition-group

列表过渡

#动画组件的封装

#keep-alive

内容标签

路由被激活触发

Detail 不被缓存

#项目

#Vue init webpack xxx

#webpack配置

#修改配置文件，需要重启

#设置代理

#router

#history模式

#设置保留滚动条的位置

当路由返回上一层时，设置滚动条的位置和上次一样

#路由中强制要求传入参数

设置必填项为 路由参数中的某一项

#指定命名路由

可以根据不同的路由控制不同的 router-view

#导航守卫

#全局钩子

#局部钩子

router.js 中

#组件钩子

#vue插件

#Better-scroll

通过循环生成的ref 是个数组

#vuex

#集成

npm i vuex -S

1

Store>Index.js 

#常规使用

#简化使用