VladikOtez

simple square fun

Jun 8th, 2017
157
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <body>
  2. <div id="app">
  3.     <div class="demo" :style="{backgroundColor: color}"></div>
  4.     <div class="demo" :style="myStyle"></div>
  5.     <div class="demo" :style="[myStyle,{height: width+'px'}]"></div>
  6.     <hr>
  7.     <input type="text" v-model="color">
  8.     <input type="text" v-model="width">
  9. </div>
  10. <script>
  11.     new Vue({
  12.        el: '#app',
  13.         data: {
  14.            color: 'gray',
  15.             width: 100
  16.         },
  17.         computed:{
  18.            myStyle: function () {
  19.                return {
  20.                    backgroundColor: this.color,
  21.                    width: this.width + 'px'
  22.                }
  23.            }
  24.         }
  25.     });
  26. </script>
  27. </body>
RAW Paste Data