摘要: 下面是一个todoList列表的实现,包含有以下功能: <!-- 代办事项网页需求 1.移动端为主、pc端可用 2.输入框:输入待办事项 3.未完成列表:能够显示出未完成的内容,已经可以对每一项内容,进行修改(改完成,删除) 4.已完成列表:能够显示完成的内容,可以对每一项内容进行修改(改未完成,修 阅读全文
posted @ 2020-09-29 18:23 peifengyang 阅读(217) 评论(0) 推荐(0) 编辑
摘要: Vue 提供了 transition 的封装组件,在下列情形中,可以给任何元素和组件添加进入/离开过渡 条件渲染 (使用 v-if) 条件展示 (使用 v-show) 动态组件 组件根节点 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> 阅读全文
posted @ 2020-09-25 08:56 peifengyang 阅读(101) 评论(0) 推荐(0) 编辑
摘要: Vue中的一些表单输入绑定:(单选框和复选框的实现)一些特殊的修饰符的使用 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="js/vue.js" type="text/ 阅读全文
posted @ 2020-09-24 11:57 peifengyang 阅读(128) 评论(0) 推荐(0) 编辑
摘要: Vue中的事件绑定: 1.可以使用表达式完成事件操作 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="js/vue.js" type="text/javascript" chars 阅读全文
posted @ 2020-09-23 17:50 peifengyang 阅读(164) 评论(0) 推荐(0) 编辑
摘要: 一:内联样式: 1.内联样式变量拼接 2.内联样式放置对象 3.CSS数组方式拼接 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="js/vue.js" type="tex 阅读全文
posted @ 2020-09-22 11:10 peifengyang 阅读(269) 评论(0) 推荐(0) 编辑
摘要: 样式的绑定与使用: 1.通过对象的方式决定是否存在某个类 2.直接放置对象 3.放置数组 4.放置字符串 5.数组和对象混合使用 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style type="t 阅读全文
posted @ 2020-09-21 16:36 peifengyang 阅读(166) 评论(0) 推荐(0) 编辑
摘要: Vue中的监听器 监听事件watch <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="js/vue.js" type="text/javascript" charset="utf- 阅读全文
posted @ 2020-09-21 15:41 peifengyang 阅读(153) 评论(0) 推荐(0) 编辑
摘要: VueDay05计算属性 利用计算属性的使用,缓存计算结果,提高性能。计算属性是基于它们的响应式依赖进行缓存的。只在相关响应式依赖发生改变时它们才会重新求值。 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> 阅读全文
posted @ 2020-09-17 11:35 peifengyang 阅读(202) 评论(0) 推荐(0) 编辑
摘要: Vue中一些基本的模板语法: 1.v-once:一次性插入,不再修改 2.插入HTML内容:v-html="htmlTxt" 3.绑定动态属性,全写v-bind:id="idname" 4.三元运算符:{{isVip?"欢迎VIP用户回来":"普通用户请充值"}} 5.事件的绑定:v-on:clic 阅读全文
posted @ 2020-09-16 08:27 peifengyang 阅读(136) 评论(0) 推荐(0) 编辑
摘要: Vue列表渲染,v-for的使用 ①v-for="item in stars ②v-for="item,key in students ③v-for="item,key in students[0] 代码如下: <!DOCTYPE html> <html> <head> <meta charset= 阅读全文
posted @ 2020-09-14 11:10 peifengyang 阅读(205) 评论(0) 推荐(0) 编辑