vue指令v-bind
程序员文章站
2022-04-24 16:28:12
v-bind用于绑定 html 属性,通常会将v-bind缩写(如"v-bind:class"可缩写成":class"); v-bind除了可以绑定字符串类型变量以外,还可以支持单一的JavaScript表达式,如: 执行函数: 使用v-bind有三种绑定方法: ......
v-bind用于绑定 html 属性,通常会将v-bind缩写(如"v-bind:class"可缩写成":class");
v-bind除了可以绑定字符串类型变量以外,还可以支持单一的JavaScript表达式,如:
-
执行运算:
<div id="app"> <p v-bind:title="t1 + ' ' + t2">html属性不能使用双大括号形式绑定,只能使用v-bind指令</p> </div> ...... var vm = new Vue({ el: '#app', data: { t1: 'title1', t2: 'title2' } });
-
执行函数:
<div id="app"> <p v-bind:title="getTitle()">html属性不能使用双大括号形式绑定,只能使用v-bind指令</p> </div> ...... var vm = new Vue({ el: '#app', data: { getTitle: function () { return 'title content'; } } });
使用v-bind有三种绑定方法:
- 对象型:'{red:isred}'
- 三目型:'isred?"red":"blue"'
- 数组型:'[{red:"isred"},{blue:"isblue"}]'
上一篇: leetcode【每日抑题 530 二叉搜索树的最小绝对差】
下一篇: HTML基础篇二
推荐阅读