app.component

如果同时传递一个组件名字符串及其定义，则注册一个全局组件；如果只传递一个名字，则会返回用该名字注册的组件 (如果存在的话)。

import { createApp } from "vue";
import App from "./App.vue";

const app = createApp(App);

// 注册一个选项对象
app.component("MyComponent", {
  /* ... */
});

// 得到一个已注册的组件
const MyComponent = app.component("MyComponent");

app.config

每个应用实例都会暴露一个 config 对象，其中包含了对这个应用的配置设定。你可以在挂载应用前更改这些属性 (下面列举了每个属性的对应文档)。

import App from "./App.vue";
import { createApp } from "vue";

const app = createApp(App);

console.log(app.config);

app.config.globalProperties

效果类似于之前的 Vue.propertyo.xxxx

app.config.compilerOptions.comments = true;

在模板中：

<div>{{comments}}</div>

在选项式 API 中：

this.comments;

在 组合式 API 中

import { getCurrentInstance } from "vue";
const ins = getCurrentInstance();
const { xxxxxxx } = ins?.appContext.config.globalProperties?.xxxxxxx;

app.directive

如果同时传递一个名字和一个指令定义，则注册一个全局指令；如果只传递一个名字，则会返回用该名字注册的指令 (如果存在的话)。

import { createApp } from "vue";
import App from "./App.vue";

const app = createApp(App);

// 注册(对象形式的指令)
app.directive("myDirective", {
  /* 自定义指令钩子 */
});

// 注册(函数形式的指令)
app.directive("myDirective", () => {
  /* ... */
});

// 得到一个已注册的指令
const myDirective = app.directive("myDirective");

更新日志

2025/8/24 08:17

查看所有更新日志

• e7112-1于 2025/8/24