tyrel/learnin-some-vue
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

s2e29 no css classes, but still style

Browse Source
This commit is contained in:
Tyrel Souza 2018-04-13 15:10:41 -04:00
parent a42d60c876
commit 73b096560c
No known key found for this signature in database
GPG Key ID: 5A9394D4C30AEAC0
2 changed files with 11 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app.js
View File

@ -1,16 +1,14 @@
var app = new Vue({
el: '#app',
data: {
attachRed: false,
attachGreen: false,
attachBlue: true,
color: "green"
color: "gray",
width: 100
},
computed:{
divClasses(){
myStyle(){
return {
red: this.attachRed,
blue: !this.attachRed
backgroundColor: this.color,
width: this.width + "px"
}
}
}

14
index.html
View File

@ -7,14 +7,12 @@
</head>
<body>
<div id='app'>
<div class="demo"
@click="attachRed = !attachRed"
:class="{red: attachRed}"
></div>
<div class="demo" :class="divClasses"></div>
<div class="demo" :class="[color, {red: attachRed}]"></div>
<hr>
<input type="text" v-model="color">
<div class="demo" :style="myStyle"></div>
<div class="demo"></div>
<div class="demo"></div>
<hr>
<input type="text" v-model="color">
<input type="text" v-model="width">
</div>
<script src="app.js" charset="utf-8"></script>
</body>