Frontend

Function declarative function sayHello ( name ) { console . log (` My name is ${ name } `) } sayHello ( ' Ahmad ' ) Bisa diubah menjadi satu baru function const sayHello = ( name ) => console . log (` ${ name } `)  sayHello ( ' Ahmad ' ) Function ditandai dengan () akan tetap case disini bisa juga tanpa menuliskan parameter () const sayHello = name => console . log (` ${ name } `)  sayHello ( ' Ahmad ' )

Parameter dari fungsi bisa berupa tipe data apapun mulai dari string, number, boolean, array, object ataupun tipe data lainnya bahkan fungsi. function sum ( ... numbers ) { let result = 0 for ( const number of numbers) { result += number } return result } console . log ( sum ( 1 , 3 , 4 , 2 , 5 )) Jika parameter dari sebuah fungsi sebuah object kita manfaatkan destructuring object untuk mendapat nilainya. const user = { id: 24 , displayName: ' Ahmad ' , address: ' Brebes ' } function myName ( { displayName , address } ) { console . log (` ${ displayName } in ${ address } `) } myName (user) Ketika kita memasukan parameter pada fungsi maka wajib baginya ketika mereturn sesuai dengan parameter yang ada. jika tidak maka akan undefined. solusinya kita bisa menambahkan nilai parameter default function exponentsFormula ( baseNumber , exponent = 4 ) { // default value let result = baseNumber ** exponent; console . log (` ${ ba...

Tambahkan di main.ts import axios from ' axios ' const pinia = createPinia () const app = createApp (App) . use (IonicVue) . use (router) . use (pinia); const axiosInstance = axios . create ({ withCredentials: true , }) router . isReady () . then ( () => { app . component ( ' Loading ' , Loading) app . config . globalProperties . $axios = { ... axiosInstance } app . mount ( ' #app ' ); }) Tinggal pake di component  async mounted () { await this . $axios . get ( ' //jsonplaceholder.typicode.com/users ' ) }, Sebagai catatan: keyword this gak jalan di setup dan jangan taruh di dalam defineComponent gunakan export default { } biasa

 Ada 3 pembahasan dalam reusability pada vue js Composable Pada vue application "composable" itu function yang di manfaatkan oleh composition api untuk merangkum dan mengulang kembali stateful logic. Yang biasanya gini  < script setup > import { ref, onMounted, onUnmounted } from " vue " ; const y = ref ( 0 ); const x = ref ( 0 ); function update ( event ) { x . value = event . pageX ; y . value = event . pageY ; } onMounted ( () => window . addEventListener ( " mousemove " , update)); onUnmounted ( () => window . addEventListener ( " mousemove " , update)); </ script > < template > Mouse position {{ x }} , {{ y }}</ template > Ada perubahan di dalam <script> <!-- template/ component --> < script setup > import { useMouse } from " ../composable/mouse " ; const { x , y } = useMouse (); </ script > < template > Mouse position {{ x }} , {{ y }}...