v-bind ゝ一纸荒年。 2022-06-02 10:12 131阅读 0赞 <!DOCTYPE html> <html> <head> <title></title> <script type="text/javascript" src="js/vue.js"></script> </head> <body> <div id="example"> <a v-bind:href="myUrl">百度</a> <img v-bind:src="'img/'+imgName"> <!-- <img v-bind:src="imgPath"> --> </div> <script type="text/javascript"> new Vue({ el:'#example', data:{ msg:'VueJS is Awesome', myUrl:'https://www.baidu.com', imgName:'index5.JPG', imgPath:'img/index5.JPG' } }); </script> </body> </html> <!DOCTYPE html> <html> <head> <title></title> <script type="text/javascript" src="js/vue.js"></script> <style type="text/css"> .myRed{ color: red } </style> </head> <body> <div id="example"> <h1 :class="{myRed:false}">test</h1> <p :style="{backgroundColor:myBGColor}">{ {msg}}</p> <button @click="changeBGColor">点击改变p标签背景色</button> </div> <script type="text/javascript"> new Vue({ el:'#example', data:{ msg:'VueJS is Awesome', myBGColor:'#FF0000' }, methods:{ changeBGColor(){ this.myBGColor='#0000FF'; } } }); </script> </body> </html>
还没有评论，来说两句吧...