Advertisement
Guest User

Untitled

a guest
Feb 26th, 2020
113
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 0.61 KB | None | 0 0
  1. <div id="app">
  2. <div v-for="s in status">
  3. <div v-if="s == 'YES'" class="yes">{{ s }}</div>
  4. <div v-else-if="s == 'NO'" class="no">{{ s }}</div>
  5. <div v-else class="empty">{{ s }}</div>
  6. </div>
  7. </div>
  8.  
  9.  
  10. new Vue({
  11. el: "#app",
  12. data: {
  13. status: [ "YES", "NO", "null" ]
  14. },
  15. methods: {
  16. }
  17. })
  18.  
  19. body {
  20. background: #20262E;
  21. padding: 20px;
  22. font-family: Helvetica;
  23. }
  24.  
  25. #app {
  26. background: #fff;
  27. border-radius: 4px;
  28. padding: 20px;
  29. transition: all 0.2s;
  30. }
  31.  
  32. .yes {
  33. background-Color: green
  34. }
  35.  
  36. .no {
  37. background-Color: red
  38. }
  39.  
  40. .empty {
  41. background-Color: grey
  42. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement