示例小白教程网www.2d5.net 代码<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>双向数据绑定v-model指令（图片img）</title>
<!--加载本地vue.js的框架-->
<script src="vue2.2.2.min.js"></script>
</head>
<body>
<!--定义div区块的id的值,这里定义的值为"app",后面vue会使用该值-->
<div id="app">
<!--加载一个图片，图片的地址通过参数传递-->
<img v-bind:src="tupiandizhi" width="50"></img><br>
</div>
<script>
//下面是Vue.js的代码块-开始
new Vue({
el: '#app',//app为前面div区块的id的值，通过"#"号绑定
//data区域定义属性的值
data: {
tupiandizhi:'img/v.png'//定义图片地址
//后面没有数据，则这里定义完毕后面不需要跟上逗号"，"
}
}) //Vue.js的代码块-结束
</script>
</body>
</html>效果图小白教程网www.2d5.net 
|
