style 里面怎么使用数据绑定 (vue 2.x 版本)

<div v-bind:style="{margin-left: test + 'px' }"></div>
这样写报错
v-bind directives require an attribute value

阅读 12.7k
3 个回答

CSS 属性名可以用驼峰式 (camelCase) 或短横线分隔 (kebab-case,记得用单引号括起来) 来
文档写的很清楚。如果按照你的写法,就是

<div v-bind:style="{'margin-left': test + 'px' }"></div>

或者

<div v-bind:style="{marginLeft: test + 'px' }"></div>

望采纳:)

1.对象语法形式绑定<div v-bind:style="styleObject"></div>
2.数组语法形式绑定<div v-bind:style="[baseStyles, overridingStyles]"></div>
3.直接class<div v-bind:class="[class1,class2]"></div>

思路:
<div v-bind:style="style"></div>

data(){
let test = 100;
return{
style:'margin-left:'+ test + 'px'
}
}

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题