![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vscode
Avery_xu
这个作者很懒,什么都没留下…
展开
-
vue过滤器2
1、本文章实现filter时间格式过滤(界面输出正规时间格式),directive实现初始界面光标锁定,directive实现输入框文字效果导向。 2、directive里有bind()(效果)、inserted()(行为)、updated()三个重构函数。 3、filter与过滤有关,directive与改变有关。 directive界面调用代码(v-focus、v-color) <lab...原创 2020-01-03 16:18:03 · 173 阅读 · 0 评论 -
Vue过滤器1
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Com...原创 2020-01-03 15:22:28 · 200 阅读 · 0 评论 -
vue实现数据增删查
1添加数据(v-model数据双向绑定,使数据实时更新) 界面代码(附带bootstrap表格样式 ) <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title">添加品牌</h3> ...原创 2020-01-03 15:17:10 · 451 阅读 · 0 评论 -
vue生命周期函数
2beforeCreate()、created()、beforeMount()、mounted()、beforeUpdate()、updated() <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content=...原创 2020-01-03 14:43:53 · 110 阅读 · 0 评论 -
vue动画基础篇
全部代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...原创 2020-01-03 14:37:14 · 104 阅读 · 0 评论 -
vue动画基础篇2
全部代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2020-01-03 14:33:43 · 175 阅读 · 0 评论 -
vue-bounceIn/bounceOut弹性闯进闯出效果
引用样式 <link rel="stylesheet" href="./lib/animate.css"> div主要代码 <!-- 可用v-bind(:)式绑定,分别确定进出的时长,也即距离 --> <transition enter-active-class="bounceIn" leave-active-class="bounceO...原创 2020-01-03 14:29:25 · 1921 阅读 · 0 评论 -
vue动画钩子函数应用:加入购物车初步模型(小半场)
body部分行为控制代码 <transition @before-enter="beforeEnter" @enter="enter" @after-enter="afterEnter"> <div class="ball" v-show="flag"></div> </transition> ...原创 2020-01-03 14:18:00 · 131 阅读 · 0 评论 -
vue列表动画
vue列表动画 主要样式style /* transition渐变出入场必写基础项 */ .v-enter,.v-leave-to{ opacity: 0; transform:translateY(80px); } .v-enter-active,.v-leave-active{ transition: all 0.6s ease; } /* tran...原创 2020-01-03 14:01:27 · 390 阅读 · 0 评论