
Vue
文章平均质量分 51
彼岸的饭碗
我是面瘫 我还爱吃小熊饼干
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
9.vue学习之小案例---微博发布框
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> .big{原创 2021-05-18 13:27:37 · 433 阅读 · 0 评论 -
8.vue学习之小案例----选项卡的制作
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{ mar原创 2021-05-18 11:54:27 · 204 阅读 · 0 评论 -
7.常用指令(下)v-on,v-bind,v-model的常见操作
v-on v-on的作用是给元素添加事件监听。可以简写为@ 我们学习的JavaScript的元素的事件监听都可以在VUE中使用 原生的JavaScript事件监听 事件名称 方法 点击 onclick 双击 ondbclick 鼠标移上 onmouseenter 鼠标离开 onmouseleave 鼠标滑过 onmousemove 鼠标移除 onmouseout 失去焦点 onblur 聚焦 onfocus 键盘事件 onkeydown 上表的方法都是原生原创 2021-05-14 17:15:45 · 353 阅读 · 0 评论 -
6.常用指令(上)v-cloak,v-once,v-pre
v-cloak v-cloak指令的作用是vue示例渲染后关联结束 双大括号插值语法在遇到网络延迟的时候会显示编译前的文本 <body> <div id="app"> <p>{{a}}</p> </div> <script src="vue.js"></script> <script> var vue=new Vue({ el原创 2021-05-14 10:27:11 · 238 阅读 · 0 评论 -
5.v-text与v-html常见操作
v-html与v-text都是渲染文本的指令,使用场景会有所不同。 我们一般的渲染方法是: 双大括号插值:{{}} v-text v-html 浅谈v-text 其中双大括号与v-text渲染内容类似,都是以文本类型进行编译。 <p>{{a}}</p> <p v-text="a"></p> 结果: v-text与双大括号的区别 双大括号在渲染结果之前,隐约会有编译之前的文本显示,v-text是没有这种现象的。 双大括号更灵活,中间是可以添加内容的原创 2021-05-14 08:57:49 · 235 阅读 · 0 评论 -
4.vue常见指令v-for的基本使用
v-for是vue的循环指令,它的作用是遍历数组(对象)的每一个值 <body> <div id="app"> <ul> <li v-for="item in arr"> {{item}} </li> </ul> </div> <script src="vue.js"></原创 2021-05-13 21:22:45 · 1911 阅读 · 0 评论 -
3.Vue的常用指令之v-if与v-show
1.指令 directive vue指令的作用是通过带有v-的特殊属性,实现对dom的响应式加载 2.v-if v-if的作用是通过一个布尔表达式对dom的上树与下树的渲染 基本使用: <p v-if="false">我是第一行dom元素</p> <p v-if="true">我是第二行dom元素</p> 但是通常工作中不是使用布尔值直接进行渲染的,而是通过data带有布尔值的表达式进行判断。 <body> <div id="app原创 2021-05-13 17:49:33 · 329 阅读 · 0 评论 -
2.Vue的插值语法
1.Vue的插值语法 插值语法是通过{{}}进行书写,内部是对data数据管理中的属性进行渲染,也可以是表达式 moustache(胡子)是对大括号的学名,也叫(胡子语法) 实例 内部也可以存放表达式 {{a>=100 ? 20 :10}} 表达式要尽量简单,比如简单判断,不可以用if语句 ...原创 2021-05-13 16:44:43 · 662 阅读 · 0 评论 -
1.Vue的基本使用
1.复制VUE源码,创建js 打开网站https://cn.vuejs.org/v2/guide/#Vue-js-%E6%98%AF%E4%BB%80%E4%B9%88 复制两个网站中的一个(其中一个是开发版本,一个是生产版本),全选,复制 粘贴创建js文件,放到项目指定目录中 2.HTML引入基本结构 <body> <div id="app"> <h1> {{data}}</h1> </div>原创 2021-05-13 16:36:20 · 78 阅读 · 0 评论