Adakah bas acara vue dimansuhkan?

vue3 membatalkan bas acara global kerana keselamatan yang rendah. Bas acara global ialah teknologi komunikasi mana-mana komponen global, iaitu komunikasi antara mana-mana komponen boleh dicapai. Dalam vue3, jika anda ingin menggunakan bas acara global, anda perlu memperkenalkan sarung tangan perpustakaan pihak ketiga atau pemancar kecil.

Persekitaran pengendalian tutorial ini: sistem windows7, versi vue3, komputer DELL G3.

vue3 membatalkan bas acara global kerana keselamatan yang rendah.

bas acara global vue

bas acara global ialah teknologi komunikasi komponen arbitrari global.

Seperti namanya, komunikasi antara mana-mana komponen boleh dicapai.

Ia berkomunikasi melalui boneka, boneka yang boleh diakses oleh semua komponen, dinamakan dalam vue $bus

In vue2

kita boleh terus menggunakan cangkuk kitaran hayat beforecreated
dalam fail entri mian.js untuk terus mencipta $bus

beforeCreate() {
	Vue.prototype.$bus = this
}

Hanya ingat untuk menulis cangkuk dalam 挂载之前.

Apabila digunakan:

• Gunakan mountedcangkuk untuk mengikat pemantauan acara dalam komponen yang perlu menerima data

mounted() {
  this.$bus.$on('hello',(data) => {
    console.log(data);
  })
},

• Cetuskan kaedah ini dalam operasi yang perlu dihantar dalam komponen yang perlu menghantar data

methods: {
  sendStudentName(){
    this.$bus.$emit('hello',this.name)
  }
},

• Ia belum tamat, jika komponen musnah, ingat untuk membuka ikatan acara, buka ikatan di mana sahaja ia terikat, gunakan beforeDestroycangkuk

beforeDestroy() {
  this.$bus.$off('hello')
},

Dalam vue3

Dalam vue3, bas acara global dibatalkan Jika kami ingin menggunakannya, kami perlu memperkenalkan perpustakaan pihak ketigamitt atau tiny-emitter

1. Pasang perpustakaan sarung tangan

npm i mitt -s

2. Kemaskan fail js dalam direktori akar supaya ia boleh diimport dan digunakan dalam komponen > Sebaiknya namakan fail yang terkenal, seperti

eventBus.jsKandungan:

3 Gunakan

//导入
import mitt from 'mitt';
 //定义,定义也最好见名知义
const emitter = mitt();
 //暴露
export default emitter;

1) Komponen yang berkomunikasi dengan setiap satu keperluan lain untuk mengimport js

2) Komponen yang menerima data berada dalam

import emitter from '../../eventBus'

Pemantauan peristiwa mengikat dalam

setup（）

Fungsi anak panah di sini juga boleh digantikan dengan fungsi biasa

setup(){
  emitter.on('event',(info) => {
    ...
  })
  return{}
}

3) Komponen yang menghantar data boleh menghantar data apabila dicetuskan

4) Sebelum komponen dimusnahkan, lepaskan ikatan acara itu Jika anda menggunakan fungsi biasa, letakkan fungsi dalam parameter kedua Jika ia adalah fungsi anak panah, anda tidak perlu menulisnya. Seperti di atas onEvent

setup(){
	function send(info) {
		emitter.emit('event',info)
	)
	return{}
}

[Cadangan berkaitan:

tutorial video vuejs

onBeforeUnmount(()=>{
	emitter.off("event", onEvent);
})

,

pembangunan bahagian hadapan web

]

Atas ialah kandungan terperinci Adakah bas acara vue dimansuhkan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!