Vue指令
关注
分享
扫一扫
Vue指令
卡卡西Sensei
这个作者很懒，什么都没留下…
展开
-
Vue指令之v-bind
Vue指令之v-bindv-bind指令是专门操作属性的指令，什么是属性？例如设置图片是src，设置鼠标悬停的文本是title，还有类class等。其实元素的属性有很多中，都是写在元素的内部。那该如何设置属性呢，v-bind改如何使用呢？1.如何使用v-bind指令语法是v-bind:属性名=表达式固定写法：<img src="图片地址"/>那要设置属性就是这么写(v-bind写法)，图片的src属性的值就是...原创 2020-12-11 13:40:17 · 1180 阅读 · 0 评论 -
Vue指令之v-on
Vue指令之v-on目录Vue指令之v-on1.v-on怎么使用？2.事件名到底写什么呢？3.方法名在哪里定义呢？4.v-on的简写5.访问data中的数据,通过this关键字6.总结v-on指令是事件绑定指令，当用户需要点击，按下键盘，滚动鼠标等操作时，想要添加一些自己的逻辑处理时，就可以为特定的元素绑定一些特定的事件。我们先在被vue实例挂载的标签div中，放入一个按钮为input标签，在标签内部写入v-on指令，冒号(:)后面就是事件名，等号(=)后面就是需..原创 2020-12-07 15:15:19 · 11540 阅读 · 0 评论 -
Vue指令之v-html
Vue指令之v-htmlv-html指令是设置innerHTML1.v-html该怎么使用呢？？？我们先在被vue实例挂载的标签div中，放入一个p标签，在p标签内部写入v-html指令，<p v-html="name"></p> ，那么name的值哪里来呢？这就需要在data中去定义了，对于普通的文本和v-text没有什么差异，但是对于html结构就不一样了，它就会被解析出来，如下代码：2.普通文本：...原创 2020-12-01 16:29:26 · 56948 阅读 · 0 评论 -
Vue指令v-show和v-if的区别
v-if和v-show是在前端开发中是比较常用的Vue指令，经常用来判断渲染部分代码块原创 2020-11-27 10:49:23 · 41301 阅读 · 5 评论 -
Vue指令之v-text
Vue指令之v-text目录1.v-text该怎么使用呢？？？2.插值表达式3.总结：v-text 指令一看就是和文本有关系，没错其实就是设置标签的文本值（textContent）。1.v-text该怎么使用呢？？？我们先在被vue实例挂载的标签div中，放入一个h3标签，在h3标签内部写入v-text指令，<h3 v-text="name"></h3> ，那么name的值哪里来呢？...原创 2020-11-30 13:59:30 · 6118 阅读 · 0 评论 -
Vue指令之v-if
Vue指令之v-ifv-if指令根据表达式的值的真假，切换元素的显示和隐藏，其实是在操作dom元素;v-if和js里的if差不多，也会有v-else-if和v-else，js里的if判断是用于在js语法里面的判断，v-if在vue中是对于代码块的判断； 如 <p v-if="isShow">不装了，我摊牌了，没错你要找的就是我</p>当指令的判断isShow为true时，p标签则会生成，进而在页面中显示出来，反之在编...原创 2020-11-23 14:21:47 · 23140 阅读 · 0 评论 -
Vue指令之v-show
Vue指令之v-showv-show指令，根据表达式的真假来显示元素和隐藏，是响应式的v-show 指令通过改变元素的 css 属性（display）来决定元素是显示还是隐藏。1.html、js 代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="...原创 2020-11-19 15:50:58 · 3252 阅读 · 0 评论