Apakah perbezaan antara kaedah global dan kaedah contoh dalam vue

Perbezaan antara kaedah global dan kaedah contoh dalam vue: 1. Kaedah global dipanggil melalui "Vue.myGlobalMethod", dan kaedah contoh dipanggil melalui "this.$myMethod" 2. Kaedah global ditakrifkan di bawah vue Kaedah statik dan kaedah contoh boleh ditakrifkan di dalam komponen.

Persekitaran pengendalian tutorial ini: sistem Windows 10, vue versi 2.9.6, komputer DELL G3.

Apakah perbezaan antara kaedah global dan kaedah contoh dalam Vue

Dalam pembangunan, untuk meningkatkan kebolehgunaan semula dan memudahkan kod, ia selalunya diperlukan untuk Bahagian biasa kod diekstrak untuk membentuk modul boleh guna semula. Selepas kod diekstrak untuk membentuk modul, untuk dirujuk di mana-mana, modul ini perlu ditetapkan sebagai atribut global. Oleh itu, untuk melaksanakan kaedah awam global, kita perlu mengetahui perkara pengetahuan berikut:

Cara menetapkan atribut global

Cara merujuk atribut global

1. Tetapkan atribut global

Sifat global boleh dibahagikan kepada: pembolehubah global dan kaedah global. Cara biasa untuk melaksanakan pembolehubah global ialah menggunakan vuex (penggunaan vuex tidak akan diterangkan secara terperinci di sini). Seterusnya, saya akan memberi tumpuan kepada prototaip.

2. Rujukan sifat global

Apabila menggunakan Vue, kita perlu menulis rentetan kod ini:

var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})

Kod di atas mencipta Vue dengan bantuan Objek pembina Vue.

Dari sini dapat dilihat bahawa Vue sebenarnya adalah objek. Kemudian kita boleh menggunakan prototaip Vue untuk melaksanakan rujukan kepada sifat global. Pertama sekali, kita perlu memahami perkara pengetahuan berikut:

Apakah itu prototaip?

Dalam kod js, kita sering melihat prototaip atribut. Ia adalah atribut pembina (fungsi yang digunakan untuk membina objek) dan digunakan untuk menunjuk ke objek prototaip. Jadi apakah objek prototaip? Untuk memahami "objek prototaip", kita perlu memisahkan "prototaip" dan "objek" untuk menerangkan.

Mari kita bincangkan tentang objek dahulu. Terdapat banyak objek terbina dalam dalam js, seperti String, Math, Object, Array, dsb.

// 声明一个数组对象
const arr = Array();

Perkara di atas adalah untuk mencipta tatasusunan menggunakan objek terbina dalam - pembina tatasusunan.

Sudah tentu, kita juga boleh menetapkan objek tersuai, iaitu, menetapkan objek baharu sendiri.

const obj = {};

Kod di atas menetapkan objek kosong.

Kejadian Vue mendedahkan beberapa sifat dan kaedah tika yang berguna. Sifat dan kaedah ini diawali dengan $ untuk membezakannya daripada sifat data proksi

Pokok komponen

• $parent: digunakan untuk mengakses contoh induk bagi contoh komponen

• $root: digunakan untuk mengakses tika akar bagi pokok komponen semasa

• $children: digunakan untuk mengakses contoh komponen anak langsung bagi contoh komponen semasa

• $refs: Subkomponen yang digunakan untuk mengakses arahan v-ref

akses DOM

• $el : Digunakan untuk melekapkan elemen dom bagi contoh komponen semasa

• $els: Digunakan untuk mengakses elemen DOM menggunakan arahan v-el dalam elemen $el

Perbezaan

Kaedah global boleh difahami sebagai window.myGlobalMethod Apabila dipanggil melalui Vue.myGlobalMethod, ia hanyalah kaedah statik yang ditakrifkan di bawah Vue

. Kaedah contoh, ingat Mari kita lihat konsep kelas dalam JS dan maksud rantai prototaip prototaip Jika anda tidak memahaminya, mari kita lihat kandungan asas ini terlebih dahulu.
Di sini saya boleh menerangkannya kepada anda Kaedah contoh boleh dipanggil di dalam komponen melalui ini.$myMethod

[Cadangan berkaitan: "tutorial vue.js"]

Atas ialah kandungan terperinci Apakah perbezaan antara kaedah global dan kaedah contoh dalam vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!