質問編集履歴

2

Navbarのソース他を追記しました

2020/11/10 08:29

投稿

Tikka123456
Tikka123456

スコア34

test CHANGED
File without changes
test CHANGED
@@ -188,6 +188,10 @@
188
188
 
189
189
  **追記**
190
190
 
191
+
192
+
193
+ 参考にしているサイトhttps://www.hypertextcandy.com/vue-laravel-tutorial-setting-up-spa-project/
194
+
191
195
  ```ここに言語を入力
192
196
 
193
197
  .js
@@ -213,3 +217,123 @@
213
217
  └──router.js
214
218
 
215
219
  ```
220
+
221
+ Navbar.vue
222
+
223
+ ```ここに言語を入力
224
+
225
+ <template>
226
+
227
+ <nav class="nav grey lighten-4 py-4">
228
+
229
+ <RouterLink class="navbar-brand" to="/">
230
+
231
+ タイトル
232
+
233
+ </RouterLink>
234
+
235
+
236
+
237
+ <ul class="navbar-nav ml-auto">
238
+
239
+ <div class="navbar-menu">
240
+
241
+ <li class="navbar-item">
242
+
243
+ <button type="button" class="btn btn-secondary btn-rounded">
244
+
245
+ <i class="icon ion-md-add"></i>
246
+
247
+ Submit a photo
248
+
249
+ </button>
250
+
251
+
252
+
253
+ </li>
254
+
255
+
256
+
257
+ <span class="navbar-item">
258
+
259
+ username
260
+
261
+   </span>
262
+
263
+   <div class="navbar-item">
264
+
265
+    <RouterLink class="button button--link" to="/login">
266
+
267
+ Login / Register
268
+
269
+ </RouterLink>
270
+
271
+   </div>
272
+
273
+   
274
+
275
+ </div>
276
+
277
+ </ul>
278
+
279
+
280
+
281
+
282
+
283
+
284
+
285
+ </nav>
286
+
287
+
288
+
289
+ </template>
290
+
291
+
292
+
293
+ ```
294
+
295
+ Footer.vue
296
+
297
+ ```ここに言語を入力
298
+
299
+ <template>
300
+
301
+ <footer class="page-footer font-small unique-color-dark pt-4">
302
+
303
+ <RouterLink class="button button--link" to="/login">
304
+
305
+ Login / Register
306
+
307
+ </RouterLink>
308
+
309
+ </footer>
310
+
311
+ </template>
312
+
313
+
314
+
315
+ ```
316
+
317
+ PhotoList.vue ここだけ表示されている
318
+
319
+ ```ここに言語を入力
320
+
321
+ <template>
322
+
323
+ <h1>Photo List</h1>
324
+
325
+ </template>
326
+
327
+
328
+
329
+
330
+
331
+ <script>
332
+
333
+ </script>
334
+
335
+ ```
336
+
337
+ 現在表示されている画面
338
+
339
+ ![イメージ説明](7a8e2d2ac3a7424b26bc4e9f7ae50df5.png)

1

フォルダ構成を追記しました。

2020/11/10 08:29

投稿

Tikka123456
Tikka123456

スコア34

test CHANGED
File without changes
test CHANGED
@@ -183,3 +183,33 @@
183
183
  export default router
184
184
 
185
185
  ```
186
+
187
+
188
+
189
+ **追記**
190
+
191
+ ```ここに言語を入力
192
+
193
+ .js
194
+
195
+ ├──commponent
196
+
197
+ │ ├──pages
198
+
199
+ │ │ ├──Login.vue
200
+
201
+ │ │ └──PhotoList.vue
202
+
203
+ │ ├──Navbar.vue
204
+
205
+ │ └──Footer.vue
206
+
207
+
208
+
209
+ ├──app.js
210
+
211
+ ├──App.vue
212
+
213
+ └──router.js
214
+
215
+ ```