javascript - TypeError：无法读取未定义的属性“创建”，错误“Vue”未定义Vue.js 3

Question

我正在尝试在文档中的 vue.js 3 中使用自定义指令，并且我使用了文档中的示例，但我有这些错误：

• 'Vue' 未定义。

当我从指令代码中删除“vue”时，这些错误会显示在控制台中：

• 未捕获（承诺中）类型错误：无法读取未定义的“已创建”属性
• 未捕获（承诺中）类型错误：无法读取 null 的属性“parentNode”

我认为这些错误是因为我使用 vue 版本 3，但我使用的是文档中 Vue vesion 3 中的自定义指令

主要js：

import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import "bootstrap";
import "bootstrap/dist/css/bootstrap.min.css";
import "./scss/main.scss";
import "normalize.css";

createApp(App).use(store).use(router).mount("#app");

//Directive

const app = vue.createApp({})
app.directive('highlight', {
    beforeMount(el, binding) {
        el.style.background = binding.value
    }
})

零件：

<p v-highlight="'yellow'" class="content">{{ limit(content,90, 'more...') }}</p>

你可以帮帮我吗

标签： javascripthtmlvue.jsvuejs2vuejs3

Answer 1

vue在 Vue 3 中没有调用任何对象或函数来注册一个全局指令，只是你已经定义了 app 实例，如下所示：

...
const app=createApp(App)
app.use(store).use(router).mount("#app");

app.directive('highlight', {
    beforeMount(el, binding) {
        el.style.background = binding.value
    }
})