vue中常用的属性标签
-
插值表达式{{}},可以在前后插入一些内容
-
{{title}} //title为data中定义的内容
-
如果我们想在变量之前或者后面加一些内容的话使用插值表达式
-
v-cloak:在我们vue加载之前v-cloak是存在,vue加载结束之后v-cloak就隐藏了,利用这个特性可以实现:界面防止闪烁
-
<style>
-
[v-cloak] { display: none; }
-
</style>
-
<div id="app" v-cloak>
-
v-text:会替换掉元素里的内容
-
<p v-text='p1'>allalalall</p>
-
p1为data中定义好内容,会将元素中的内容覆盖,不识别标签
-
v-html:可以渲染html界面
-
<p v-html='p2'></p>
-
识别内容中的标签
-
v-on:进行事件的绑定,用的最多的是click事件绑定
-
简写@
-
<button v-on:click="chage('111111')">按钮</button>
-
<button @click="chage('111111')">按钮</button>
-
事件修饰符
-
.stop 阻止冒泡
-
<div class="box3" @click.stop='click("最里边")'>.stop</div>
-
直接在事件后面打点使用,下同
-
.prevent 阻止默认事件
-
.capture 添加事件侦听器时使用事件捕获模式
-
.self 只当事件在该元素本身(比如不是子元素)触发时触发
-
.once 事件只触发一次
-
v-model数据双向绑定
-
<input type="text" v-model:value='title'>
-
title为data中定义的,双向绑定后用户可以更改该数据