質問編集履歴

1

説明の追記と画像の追加

2022/08/15 10:54

投稿

goroentsumugu
goroentsumugu

スコア2

test CHANGED
File without changes
test CHANGED
@@ -16,8 +16,11 @@
16
16
 
17
17
  ```Vuejs
18
18
 
19
- <v-row>
19
+ <v-row
20
+ class="pt-4"
21
+ >
20
22
  <v-col
23
+ class="pa-1"
21
24
  v-for="recipe in recipes.value" :key="recipe.recipehistory_id"
22
25
  cols="6"
23
26
  xs="4"
@@ -28,20 +31,48 @@
28
31
  class="mx-auto"
29
32
  >
30
33
  <v-img
34
+ class="white--text align-end"
35
+ height="200px"
31
- src="{{ recipe.recipe.img_url }}"
36
+ src="{{ recipe.recipe.img_url }}"
37
+ >
32
- height="200px"
38
+ <v-card-title>
33
- cover
39
+ {{ recipe.recipe.name }}
40
+ </v-card-title>
41
+ <v-card-subtitle>
42
+ 種別: {{ recipe.recipe.kinds_display }}
43
+ </v-card-subtitle>
44
+ <v-card-subtitle>
45
+ 色:{{ recipe.recipe.color_display }}
46
+
47
+ </v-card-subtitle>
34
- ></v-img>
48
+ </v-img>
49
+ <v-card-subtitle>
50
+ 売上:
51
+ <v-text-field
52
+ single-line
53
+ >
54
+ {{ recipe.sold }}
55
+ </v-text-field>
56
+
57
+ </v-card-subtitle>
35
58
  </v-card>
36
59
  </v-col>
37
- </v-row
60
+ </v-row>
38
61
  ```
62
+
63
+ 画像が表示されない
64
+
65
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-08-15/4710906a-7c5e-4e2b-8d94-b78f960361cb.jpeg)
66
+
39
67
 
40
68
  ### 試したこと
41
69
 
42
70
  URLを直接指定すると表示されますが、{src="{{ recipe.recipe.img_url }}"で動的になった場合に、Localの階層を探しているようですが、解決できませんでした。
43
71
 
72
+ 要素を確認すると、src="{{ recipe.recipe.img_url }} のままで展開されていないようです。
73
+
74
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-08-15/36ad61c1-61a6-4ebb-b308-f9bbb5ae4976.jpeg)
75
+
44
76
  ### 補足情報(FW/ツールのバージョンなど)
45
-
46
77
  Vuejs3 Vuetify3
47
78