質問編集履歴
2
コードの省略について記載
test
CHANGED
File without changes
|
test
CHANGED
@@ -11,6 +11,8 @@
|
|
11
11
|
onload内のコンソールログが表示されないので、ここの記載が間違っているようです。
|
12
12
|
|
13
13
|
どうか、ご教示のほど、よろしくお願いします。
|
14
|
+
|
15
|
+
※HTML、bodyタグなどは省略しています。
|
14
16
|
|
15
17
|
```html
|
16
18
|
|
1
scriptタグの抜け、閉じ括弧の抜けを訂正。
test
CHANGED
File without changes
|
test
CHANGED
@@ -22,42 +22,46 @@
|
|
22
22
|
|
23
23
|
|
24
24
|
|
25
|
-
|
25
|
+
<script>
|
26
26
|
|
27
|
-
e
|
27
|
+
new Vue({
|
28
28
|
|
29
|
-
|
29
|
+
el: '#app',
|
30
30
|
|
31
|
-
|
31
|
+
data: {
|
32
32
|
|
33
|
-
c
|
33
|
+
canvas: null,
|
34
34
|
|
35
|
-
|
35
|
+
ctx: null,
|
36
36
|
|
37
|
-
|
37
|
+
img: null,
|
38
38
|
|
39
|
-
|
39
|
+
src: null
|
40
40
|
|
41
|
-
|
41
|
+
},
|
42
42
|
|
43
|
-
|
43
|
+
mounted: function() {
|
44
44
|
|
45
|
-
this.c
|
45
|
+
this.canvas = this.$refs.canRef
|
46
46
|
|
47
|
-
this.
|
47
|
+
this.ctx = this.canvas.getContext('2d')
|
48
48
|
|
49
|
-
this.
|
49
|
+
this.src = 'img/tomato.png'
|
50
50
|
|
51
|
-
this.img
|
51
|
+
this.img = new Image()
|
52
52
|
|
53
|
-
|
53
|
+
this.img.onload = function() {
|
54
54
|
|
55
|
+
console.log('loaded')
|
56
|
+
|
55
|
-
this.ctx.drawImage(this.img, 0, 0);
|
57
|
+
this.ctx.drawImage(this.img, 0, 0);
|
58
|
+
|
59
|
+
}
|
56
60
|
|
57
61
|
}
|
58
62
|
|
59
|
-
}
|
63
|
+
})
|
60
64
|
|
61
|
-
|
65
|
+
</script>
|
62
66
|
|
63
67
|
```
|