![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
青柠晶晶的1024
左手代码,右手诗。
展开
-
v-bind指令
1.v-bind指令的作用是:为元素绑定属性2.完整的写法是v-bind:属性名3.简写的话可以直接省略v-bind,只保留:属性名4.需要动态的增删class建议使用对象的方式<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional/原创 2020-08-03 12:01:42 · 1212 阅读 · 0 评论 -
v-if指令
1.v-if指令的作用是:根据表达式的真假切换元素的显示状态2.本质是通过操纵dom元素来切换显示状态3.表达式的值为true,元素存在于dom树中,为false,从dom树中移除4.频繁的切换使用v-show,反之使用v-if,前者的切换消耗小<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-原创 2020-08-03 10:11:46 · 45436 阅读 · 1 评论 -
v-show指令
1.v-show指令的作用:根据真假切换元素的显示状态2.原理是修改元素的display,实现显示隐藏3.原创 2020-08-03 09:42:53 · 1924 阅读 · 0 评论 -
计数器
1.创建Vue实例时:el(挂载点)、data(数据)、methods(方法)2.v-on指令的作用是绑定事件,简写为@3.方法中通过this,关键字获取data中的数据4.v-text指令的作用:设置元素的文本值,简写为{{}}5.注意v-text与v-html的区别<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE原创 2020-08-02 17:23:07 · 126 阅读 · 0 评论 -
v-on指令
1.v-on指令的作用是:为元素绑定事件2.事件名不需要写on3.指令可以简写为@4.绑定的方法定义在methods属性中<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/h原创 2020-08-02 16:44:11 · 2095 阅读 · 0 评论 -
v-html指令
1. v-html指令的作用:设置元素的innerHTML2.内容中有html结构会被解析为标签3.v-text指令无论内容是什么,只会解析为文本<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w原创 2020-08-02 16:04:48 · 1676 阅读 · 0 评论 -
v-text指令
1.v-text指令的作用:设置标签的内容2.默认写法会代替全部内容,使用差值表达式{{}}可以替换指定内容3.内部支持写表达式<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/原创 2020-08-02 15:37:05 · 649 阅读 · 0 评论 -
第一个Vue程序
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Co.原创 2020-08-02 14:11:47 · 125 阅读 · 0 评论