vue中“:”、“@”意义

2020-06-14  本文已影响0人  Poppy11

加冒号的,是v-bind缩写,说明后面的是一个变量或者表达式;没加冒号的后面就是对应的字符串。

例子:

<el-radio-group v-model="handle">

                    <el-radio :label="true">打开</el-radio>

                    <el-radio :label="false">关闭</el-radio>

</el-radio-group>

输出:true 或 false 值是Boolean类型

<el-radio-group v-model="handle">

                    <el-radio label="true">打开</el-radio>

                    <el-radio label="false">关闭</el-radio>

</el-radio-group>

输出:”true" 或 “false” 值是String类型

加@的是v-on 缩写

<!-- 完整语法 -->
<a v-on:click="doSomething">...</a>
<!-- 缩写 -->
<a @click="doSomething">...</a>

v-bind指令用于设置HTML属性:v-bind:href 缩写为 :href

<a :href="{{url}}">aa</a>

v-on 指令用于绑定HTML事件 :v-on:click 缩写为 @click

上一篇下一篇

猜你喜欢

热点阅读