2019/05/14

Vue.js v-bind







See the Pen Vue.js v-bind by takapen (@takapen) on CodePen.










style

style

style


class red

class red fz10

class isOn1

class isOn1

class isOn1

class isOn2





*{margin: 0;padding: 0;}
hr{margin:10px 0;}
.a001{
  color:#c00;
}
.a002{
  font-size:10px;
}
.a003{
  font-weight:bold;
}





new Vue ({
  el: '#app1',
  data: {
    url:'/test.html'
  }
});

new Vue ({
  el: '#app2',
  data: {
    myColor:'#ccc',
    myFontSize:'10px',
    myBgColor:'#ccc'
  }
});

new Vue ({
  el: '#app3',
  data: {
    red:'a001',
    fz10:'a002',
    fwb:'a003',
    isOn1:true,
    isOn2:false
  }
});