Tech: Vue Parent & Child

VueJS adalah salah satu framework yang semakin popular disebabkan menunggang populariti Laravel sebagai salah satu framework PHP yang popular.

vue-basic

Satu fungsi yang bersifat triggered daripada parent class boleh di overwrite oleh child class.

export default class Parent extends Vue {
    created() {
        console.log('created from parent')
    }

    clicked() {
        console.log('clicked from parent')
    }

    parentClicked() {
        console.log('parent clicked')
    }
}
export default class Hello extends Parent {
    message:string = 'Hello Vue'

    get fullMessage() {
        return `${this.message} from Typescript`
    }

    created() {
        console.log('created from child')
    }

    clicked() {
        console.log('clicked')
    }
}

Kalau dalam PHP boleh dikatakan bahawa situasi ini adalah function override. Aku rasa sama sahaja konsepnya.

  1. Jika function bukan navigation ada di parent dan di child – function di dalam child akan digunakan.
  2. Jika function bukan navigation ada di parent sahaja – function di dalam parent akan digunakan.
  3. Jika navigation triggered invoked function ada di parent dan di child – kedua-dua function akan digunakan.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.