vue.js上传图片时同时加载图片展示图片

//导入一下三个js即可
<input type = "file" name = "image" id = "image" src = "" />
<script src="assets/js/vue.min.js" type="text/javascript" charset="utf-8"></script>
<script src="assets/js/vue-resource.min.js" type="text/javascript" charset="utf-8"></script>
<script src="//cdn.bootcss.com/axios/0.15.3/axios.min.js"></script>
<script type="text/javascript">
var vm = new Vue({
el:".data-items",
data:{
file:''
},
methods:{
//当选择选择文件时触发的方法
getFile: function(event) {
//将选择的文件放到当前vue中
this.file = event.target.files[0];
//获取选择的文件的url路径并放到指定的src下面
$("#image").prop("src",window.URL.createObjectURL(event.srcElement.files.item(0)))
console.log(this.file);
}
}
});
</script>