Pertemuan Ke 5
KELAS XII SEMESTER GANJIL
Sekilas Cerita:
Pada pertemuan kali ini, kita mempelajari tentang bagaimana membuat main view dan juga menampilkan view lebih dari 1
Hasil Project
Silahkan kalian download, project dari pertemuan ke 1-4. Disini
Routes (rute)
Proses berpindah dari halaman awal (default) ke halaman yang lain sesuai rute(routes) yang dijabarkan.
Berikut Contoh Penulisannya:
pada html:
<a href="/cards/">.....</a>
pada file routes.js
var routes = [
// Index page
{
path: '/',
url: './index.html',
name: 'home',
},
{
path: '/cards/',
url: './pages/cards.html',
},
// Default route (404 page). MUST BE THE LAST
{
path: '(.*)',
url: './pages/404.html',
},
];
kita menambahkan path dan juga url. pada bagian url terdapat 2 macam:
url
componentUrl
Perbedaannya seperti berikut.
Praktek Penambahan Fitur
Pada video kali ini kita akan menambahkan fitur:
Perintah View
Routes
Show/hide FAB right-buttom ketika Scroll
Halaman Tentang aplikasi
Mengambil nilai dari url (query parameters)
pada html:
<a href="/cards/">.....</a>
pada file routes.js
var routes = [
// Index page
{
path: '/',
url: './index.html',
name: 'home',
},
{
path: '/cards/',
url: './pages/cards.html',
},
// Default route (404 page). MUST BE THE LAST
{
path: '(.*)',
url: './pages/404.html',
},
];
kita menambahkan path dan juga url. pada bagian url terdapat 2 macam:
url
componentUrl
Perbedaannya seperti berikut.
bandicam 2021-08-18 07-10-15-300.mp4video praktek
silahkan dipraktekan.
klik disini
jika tidak muncul
