<body>
<div id="app">
<!-- 方法1 -->
<h2 :style="{backgroundColor:'pink',fontWeight:'400'}"> {{ message }} </h2>
<!-- 方法2 -->
<h2 :style="changeStyle()"> {{ message }} </h2>
<!-- 记得调用方法 -->
</div>
<script src='https://cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.js'></script>
<script>
const app = new Vue({
el: '#app',
data: {
message: "你好呀 李银河",
changeColor: 'skyblue',
changeSize: '12px'
},
methods: {
changeStyle: function() {
return {
backgroundColor: this.changeColor,
fontSize: this.changeSize
}
}
}
})
</script>
</body>
