Vue
关注
分享
扫一扫
文章平均质量分 58
神奇洋葱头
学习知识是进步的阶梯.
展开
-
12. vue 计算属性和过滤器
1. vue官方 计算属性https://cn.vuejs.org/v2/guide/computed.html#计算属性1.1 计算属性示例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" cont原创 2021-07-07 09:44:01 · 379 阅读 · 2 评论 -
11. Vue自定义指令
1. 自定义指令Vue官网 自定义指令2. 自定义全局指令3. 自定义局部指令原创 2021-07-06 11:29:20 · 114 阅读 · 0 评论 -
10. vue常用指令 v-on 给元素绑定监听事件
文章目录1. v-on指令是什么2. v-on 指令的 用法2.1 v-on指令基本格式2.2 v-on:click.stop 阻止事件冒泡事件冒泡阻止事件冒泡2.3 v-on:click.self 只有当前元素自身触发回调函数才会执行2.4 v-on:click.capture 事件捕获2.5 v-on:click.prevent 阻止默认事件2.6 v-on:click.once 只触发一次回调3. v-on指令的注意点3.1 如果回调函数不需要传递参数,那么可以把()去掉3.2 如果回调函数原创 2021-07-05 11:23:56 · 879 阅读 · 2 评论 -
9. vue常用指令 v-bind 给属性绑定值
v-bind:属性名=“value”value–指的是Vue对象中data中的 属性名key<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, i原创 2021-07-02 14:57:05 · 2248 阅读 · 0 评论 -
8. vue 常用指令 v-for 循环遍历渲染元素
v-for基本使用书写基本格式valueindexhobby是vue对象中data下面的一个数组数据<li v-for="(value, index) in hobby">爱好{{index}}----{{value}}</li><!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Com原创 2021-07-02 10:42:33 · 479 阅读 · 0 评论 -
7. vue常用指令 v-show 指定渲染后的元素是否展示
v-show=“true” 展示元素v-show=“false” 隐藏元素无论展示还是隐藏,元素都存在于页面上v-if 渲染或者不渲染元素<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" co原创 2021-07-02 10:22:22 · 623 阅读 · 0 评论 -
6. vue常用指令 v-if 条件渲染元素
v-if 条件渲染v-if=“true” 渲染元素v-if=“hidden” 不渲染元素v-if 可以从 vue 模型中取数据v-if 也可以直接赋值一个表达式v-else-if 必须紧跟 v-ifv-else必须紧跟 v-if或者 v-else-if ,它们中间不能插入其他任何指令<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-eq原创 2021-07-02 10:13:00 · 414 阅读 · 0 评论 -
5. vue常用指令 v-cloak 数据渲染完成后自动显示元素
vue数据绑定的过程先将未绑定数据的页面展示给用户将vue内部数据和页面元素进行绑定,重新渲染到页面展示给用户如果数据量过大或者网络延迟,用户会看到未绑定数据的页面v-cloak 默认隐藏未渲染数据的页面,等页面完成渲染后重新展示给用户v-cloak 数据渲染完成后自动显示元素<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv=原创 2021-07-02 09:18:17 · 835 阅读 · 0 评论 -
4. vue常用指令 v-once 初始化渲染数据
vue指令指令是vue内部提供的自定义属性指令封装好vue内部特定功能vue数据绑定特点一般情况,数据发生变化,界面显示就会同步变化v-oncev-once指令让界面渲染后,界面不在跟随数据变化而变化v-once不需要赋值,单纯的放在元素中就行<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compa原创 2021-07-02 08:57:37 · 191 阅读 · 0 评论 -
3. vue中常用指令 v-model 双向数据绑定
v-model默认情况 Vue只支持数据单向传递 M>>>VM>>>V在表单元素<input> <textarea> <select>元素上可以使用v-model指令创建双向数据绑定v-model会忽略表单元素的value checked selected属性的初始值,总是会与Vue实例的data的数据同步.<!DOCTYPE html><html lang="en"><head>原创 2021-07-02 08:40:00 · 205 阅读 · 0 评论 -
2. vue中的MVVM设计模式
文章目录1.MVVM设计模式M: Model(保存数据,处理业务逻辑)V: View 视图(展示数据,与用户交互)VM: View Model 数据和视图的桥梁特点: 支持数据双向传递2.vue中MVVM的划分(重点理解)3.vue中数据的单向传递4.示例代码1.MVVM设计模式M: Model(保存数据,处理业务逻辑)V: View 视图(展示数据,与用户交互)VM: View Model 数据和视图的桥梁特点: 支持数据双向传递M —VM— VV—VM—M2.vue中原创 2021-06-30 16:39:50 · 153 阅读 · 0 评论 -
1. vue helloworld
文章目录1. 代码2. 基础结构el:data:methods:1. 代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><script src="../js/vue.js"></script><div ID="a原创 2021-06-24 11:27:44 · 100 阅读 · 0 评论 -
nodejs安装和环境配置
文章目录1.下载安装node.js1.1 下载node.js1.2 安装node.js1.3 测试是否安装 成功node -v 查看node的版本npm -v 查看npm的版本(新版的node安装自带安装npm)2.配置环境变量2.1 配置全局安装的模块路径和缓存路径创建文件夹目录配置路径Error: EPERM: operation not permitted, mkdir 'C:\soft\nodejs' 解决方案2.2 配置环境变量2.3 测试1.下载安装node.js1.1 下载node.原创 2021-05-31 10:51:22 · 7995 阅读 · 6 评论