Rumah > hujung hadapan web > View.js > vue3 mengkonfigurasi parameter global dan cara menggunakan komponen

vue3 mengkonfigurasi parameter global dan cara menggunakan komponen

王林
Lepaskan: 2023-05-15 18:58:04
ke hadapan
3109 orang telah melayarinya

kaedah vue2

1. Lekapan global

Vue.property.xxx

import Vue from "vue";
import axios from "axios";
Vue.prototype.$http= axios;
new Vue({
  router,
  store,
  render: (h) => h(App),
}).$mount("#app");
Salin selepas log masuk

2. 🎜>1. Global mount

app.config.globalProperties.xxx

this.$http.xxx();
Salin selepas log masuk

2 penggunaan komponen

import { createApp } from 'vue'
import App from './App.vue'
import ElementPlus, { ElMessage, ElMessageBox } from 'element-plus'
import 'element-plus/dist/index.css'
const app = createApp(App);
app.config.globalProperties.$messageBox = ElMessageBox;
app.config.globalProperties.$message1 = ElMessage;
Salin selepas log masuk

Anda sudah boleh melihat. $messageBox dan $message1 yang dipasang dalam appContext.config.globalProperties Mengenai mengapa terdapat satu lagi $message

vue3 mengkonfigurasi parameter global dan cara menggunakan komponen, kita boleh melihat tangkapan skrin elemen ditambah tapak web rasmi

Anda dapat melihat bahawa ini dipasang secara lalai untuk elemen tambah, dan kami boleh menggunakannya secara langsung. Menambah $message1 di sini hanyalah untuk demonstrasi, anda boleh terus menggunakan pelekap lalai.

vue3 mengkonfigurasi parameter global dan cara menggunakan komponen

Contoh penggunaan lengkap

// 引入vue的 getCurrentInstance 方法
import { defineComponent, getCurrentInstance } from "vue";
// 获取当前组件实例
const { appContext } = getCurrentInstance();
// 打印看一下结构
console.log(appContext)
Salin selepas log masuk

Atas ialah kandungan terperinci vue3 mengkonfigurasi parameter global dan cara menggunakan komponen. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:yisu.com
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan