摘要:问题:创建vue项目的时候,手一抖把Use ESLint to lint your code?(Y/N) 选择了Y,然后到写代码的时候,虽然说是浏览器完全能运行结果,但是在cmd就是一直报错。所以大家安装的时候最好选择N。 如果不小心选择错了没有关系的,下面就是解决办法, 一)在你的项目中找到bui 阅读全文
posted @ 2019-12-26 16:10 永不服输七格格~ 阅读 (7) 评论 (0) 编辑
摘要:问题:如果在slot标签上使用v-show,程序功能是无法实现的,必须改成v-if。 原因:slot实际是一个抽象元素,有点类似template,本质并不是一个元素。 而v-show是通过控制元素的display来进行显示和隐藏的,slot本身不是元素,所以压根就不会有display这个css属性 阅读全文
posted @ 2019-12-21 14:29 永不服输七格格~ 阅读 (8) 评论 (0) 编辑
摘要:1.列表过渡使用<transition-group>标签包裹动画元素。 2.然后对v-enter,v-leave-to,v-enter-active,v-leave-active写入css样式即可。 <!DOCTYPE html> <html> <head> <meta charset="utf-8 阅读全文
posted @ 2019-12-21 13:51 永不服输七格格~ 阅读 (6) 评论 (0) 编辑
摘要:1.因Vue的复用机制,此处动画不会执行,可给元素添加唯一key值来使vue对该元素不进行复用。 2.先进入执行还是先出去执行,可在<transition>元素上设置:mode="in-out"或者mode="out-in" 3.组件的过渡和普通元素的用法一致。 4.动态组件的过渡需在动态组件内绑定 阅读全文
posted @ 2019-12-21 13:31 永不服输七格格~ 阅读 (9) 评论 (0) 编辑
摘要:JS动画效果,注意事件函数中所传递的传递的参数及某些事件函数返回的函数 1.进入动画钩子:before-enter,enter,after-enter; 2.离开动画钩子:before-leave,leave,after-leave; 3.在enter钩子中的函数调用done()告诉Vue,JS动画 阅读全文
posted @ 2019-12-21 13:07 永不服输七格格~ 阅读 (21) 评论 (0) 编辑
摘要:在Vue中同时使用过渡和动画 1.在需要设置过渡动画的元素外包裹<transition>标签,然后再设置对应的样式即可(v-enter,v-enter-active,v-leave-to,v-leave-active) 2.如果不想用默认的类,可以自定义类如,enter-active-class=" 阅读全文
posted @ 2019-12-20 18:54 永不服输七格格~ 阅读 (7) 评论 (0) 编辑
摘要:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>在Vue中使用animate.css</title> <script src="./vue.js"></script> <link rel="stylesheet" type="t 阅读全文
posted @ 2019-12-20 10:58 永不服输七格格~ 阅读 (9) 评论 (0) 编辑
摘要:在需要设置动画的标签部分用transition包裹起来。可添加name属性。Vue自动给标签在某个时间点上添加类名。 没有name值,css默认前缀名为"v" 隐藏到展示 开始有fade-enter,fade-enter-active,(第0帧未动)——第1帧fade-enter 去除,新增v-en 阅读全文
posted @ 2019-12-20 10:43 永不服输七格格~ 阅读 (8) 评论 (0) 编辑
摘要:动态组件 Vue内置<component :is="name"></component>根据is属性绑定Vue实例中data里面对应的数据名,动态切换组件,然后自动加载不同组件。 <body> <div id="root"> <!-- <child-one v-if="type 'child-one 阅读全文
posted @ 2019-12-20 09:57 永不服输七格格~ 阅读 (5) 评论 (0) 编辑
摘要:在Vue中使用插槽 组件的template里可以在任意位置添加<slot></slot>,slot为标签,称为插槽,像是一个借口,接受html数据。 具名插槽,slot标签可以添加name属性,用与区分组件中不同插槽 <slot name="header"></slot> <slot name="h 阅读全文
posted @ 2019-12-19 21:07 永不服输七格格~ 阅读 (6) 评论 (0) 编辑