質問編集履歴

2

試したこと2を追記しました。

2021/04/05 13:01

投稿

tk08
tk08

スコア15

test CHANGED
File without changes
test CHANGED
@@ -259,3 +259,83 @@
259
259
 
260
260
 
261
261
  ```
262
+
263
+
264
+
265
+ ### 試したこと2(ミニマムに1つのblade.phpに収めたものも実行しませんでした。)
266
+
267
+
268
+
269
+ ```php
270
+
271
+ <!doctype html>
272
+
273
+ <html lang="ja">
274
+
275
+ <head>
276
+
277
+ <!-- 必要なメタタグ -->
278
+
279
+ <meta charset="utf-8">
280
+
281
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
282
+
283
+ </head>
284
+
285
+
286
+
287
+ <body>
288
+
289
+ <button type="button" class="btn btn-primary" @click="onSubmit">ボタン</button>
290
+
291
+ <script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
292
+
293
+ <script>
294
+
295
+ new Vue({
296
+
297
+ el: '#app',
298
+
299
+ data: {
300
+
301
+ params: {
302
+
303
+ files: []
304
+
305
+ }
306
+
307
+ },
308
+
309
+ //createdは動作する
310
+
311
+ created: function() {
312
+
313
+ alert('created')
314
+
315
+ console.log('created!')
316
+
317
+ },
318
+
319
+ //こちらが動作しない
320
+
321
+ methods: {
322
+
323
+ onSubmit() {
324
+
325
+ alert('クリック!');
326
+
327
+ console.log('clicked!');
328
+
329
+ },
330
+
331
+ },
332
+
333
+ });
334
+
335
+ </script>
336
+
337
+ </body>
338
+
339
+ </html>
340
+
341
+ ```

1

ソースをほぼ全文のせました。構成としては頭でextendsし、下のbladeを呼ぶ形です。

2021/04/05 13:01

投稿

tk08
tk08

スコア15

test CHANGED
File without changes
test CHANGED
@@ -113,3 +113,149 @@
113
113
  node -v:v14.16.0
114
114
 
115
115
  ブラウザ:chrome バージョン: 89.0.4389.114
116
+
117
+
118
+
119
+ ### ソース全文
120
+
121
+
122
+
123
+ ```php
124
+
125
+ @extends('layouts.defalt')
126
+
127
+ <head>
128
+
129
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
130
+
131
+ </head>
132
+
133
+ @section('content')
134
+
135
+
136
+
137
+ <div class="form-group">
138
+
139
+ <label>ファイル選択</label>
140
+
141
+ <input
142
+
143
+ type="file"
144
+
145
+ class="form-control"
146
+
147
+ accept="*"
148
+
149
+ @change="onFileChange"
150
+
151
+ multiple>
152
+
153
+ </div>
154
+
155
+ <button type="button" class="btn btn-primary" @click="onSubmit">ボタン</button>
156
+
157
+
158
+
159
+ <script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
160
+
161
+ <script>
162
+
163
+ new Vue({
164
+
165
+ el: '#app',
166
+
167
+ data: {
168
+
169
+ params: {
170
+
171
+ files: []
172
+
173
+ }
174
+
175
+ },
176
+
177
+ //createdは動作する
178
+
179
+ created: function() {
180
+
181
+ alert('created')
182
+
183
+ console.log('created!')
184
+
185
+ },
186
+
187
+ //こちらが動作しない
188
+
189
+ methods: {
190
+
191
+ onSubmit() {
192
+
193
+ alert('クリック!');
194
+
195
+ console.log('clicked!');
196
+
197
+ },
198
+
199
+ },
200
+
201
+ });
202
+
203
+ </script>
204
+
205
+ @endsection
206
+
207
+ ```
208
+
209
+
210
+
211
+ ```php
212
+
213
+ <!doctype html>
214
+
215
+ <html lang="ja">
216
+
217
+ <head>
218
+
219
+ <!-- 必要なメタタグ -->
220
+
221
+ <meta charset="utf-8">
222
+
223
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
224
+
225
+ <!-- Bootstrap CSS -->
226
+
227
+ <link href="/css/tailwind.css" rel="stylesheet" type="text/css">
228
+
229
+ <link href="/css/original.css" rel="stylesheet" type="text/css">
230
+
231
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
232
+
233
+ </head>
234
+
235
+
236
+
237
+ <body>
238
+
239
+ <div class="container" style="margin-top:5px;">
240
+
241
+ @yield('content')
242
+
243
+ </div>
244
+
245
+ <!-- オプションのJavaScript -->
246
+
247
+ <!-- 最初にjQuery、次にPopper.js、次にBootstrap JS -->
248
+
249
+ <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
250
+
251
+ <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
252
+
253
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
254
+
255
+ </body>
256
+
257
+ </html>
258
+
259
+
260
+
261
+ ```