Vue的第一次学习

常用四个属性注意：（这些是vue自动提供的，我们只需要给这些类class块添加css效果即可）组件嵌套：vue-routerweb网站设计：先写结构 后写内容

常用四个属性

filters：过滤器 属性 computed:计算属性 methods：方法属性 用{{}}调用方法时要带 ‘()’ watch：观察属性 写代码要细心 不然会耽搁好多时间 点击事件、监听键盘事件都用 v-on指令 v-bind:属性绑定 可以简写为 “ ：” v-bind与prop连用 v-bind：prop="" v-on和v-bind指令写法不同 v-on的值是方法 @dblclick="" 双击按钮实现 事件修饰符stop prevent once v-model 重点掌握 双向数据绑定 v-model 才需要data：function(){ } 补充：组件的定义中，data必须是一个函数，以保证每个实例可以维护一份被返回对象的独立的拷贝 v-if 和 v-show 的区别使用： 切换频繁的用v-show 不频繁的 用v-if Prop：单项数据流

##使用transition组件时，必须与

条件渲染（使用v-if） 2. 条件展示（使用了v-show） 3. 动态组件 4. 组件根节点 同时使用

注意：（这些是vue自动提供的，我们只需要给这些类class块添加css效果即可）

1.v-enter：进入过渡效果（enter）刚刚开始那一刻。在元素被插入或者show的时候生效，在下一个帧就会立刻移除，一瞬间的事 2.v-enter-active: 表示进入过渡（entering）的结束状态。在元素被插入时生效，在 transition/animation 完成之后移除。 3.v-leave: 离开过渡（leave）的开始那一刻。在离开过渡被触发时生效，在下一个帧移除，也是一瞬间的事。 4.v-leave-active：离开过渡（leaving）的结束状态。在离开过渡被触发时生效，在 transition/animation 完成之后移除。

组件嵌套：

全局引用、局部应用 全局引用在main.js中注册全局 局部引用在App.vue中用import导入，用components调用组件 导入时需要三步：只有一步是使用组件的Id 其它两个是使用组件名

vue-router

关于使用路由细节： 1： 可以给组件自定义名称: 写在routes数组中 {path:"/",name:“menuLink”,component:Menu"} 注意是component 没有s 在组件中使用name属性：<router-link to="{name:‘menuLink’}"

2：可以用tag指定标签的类型

菜单

3：可以动态绑定 to的值，使用v-bind标签在

web网站设计：先写结构 后写内容

动手！动手！动手！