Beim Rendern wurde auf die nicht definierte Eigenschaft „$primevue“ zugegriffen

Question

Fälle und Fragen

Ich arbeite an einem privaten Projekt mit Vue.js und beim Versuch, FileUploadPrimeVue zu verwenden, ist der folgende Fehler aufgetreten ; code>Tritt auf, wenn Komponente:

[Vue-Warnung]: Beim Rendern wurde auf die Eigenschaft „$primevue“ zugegriffen, aber die Eigenschaft ist in der Instanz nicht definiert. 

Ich versuche, FileUpload in meiner Komponente zu verwenden:

<code><template>
  <FileUpload name="demo[]" @upload="onUpload"
    <Vorlage #leer>
      <p>Ziehen Sie Dateien hierher, um sie hochzuladen. </p>
    </template>
  </FileUpload>
</template>
</code>

Der Fehler tritt nur auf, wenn ich versuche, FileUpload zu verwenden. Wenn ich es entferne, funktioniert die Komponente einwandfrei. FileUpload und PrimeVue werden beide wie vorgesehen in main.js importiert.

<code>import {createApp} aus 'vue'
Router importieren aus „./router“;
Shop importieren aus „./store“;
PrimeVue aus „primevue/config“ importieren;
PrimeIcons aus „primevue/config“ importieren;
App aus „./App“ importieren;

const app = createApp(App);

app.use(
    Router,
    PrimeVue,
    PrimeIcons,
    speichern
)

importiere 'primevue/resources/primevue.min.css'
'primeflex/primeflex.css' importieren
import 'primeicons/primeicons.css'
importiere 'primevue/resources/themes/bootstrap4-dark-purple/theme.css'

Karte aus „primevue/card“ importieren;
Menüleiste aus „primevue/menubar“ importieren;
FileUpload aus „primevue/fileupload“ importieren;

app.component('Karte', Karte)
app.component('Menubar', Menüleiste)
app.component('FileUpload', FileUpload)

app.mount('#app')
</code>

Was ich versucht habe

Ich habe nach diesem Problem gesucht, aber die einzige exakte Übereinstimmung für diesen Fehler war ein altes geschlossenes Problem auf GitHub über die Calendar-Komponente: Problem Nr. 808.Dieses Problem wird durch Breaking Changes in der neuen PrimeVue API verursacht. Dies sollte bei mir nicht der Fall sein, da es in V3.1 eingeführt wurde und ich V3.7 verwende.

Wenn die Version das Problem ist, habe ich verschiedene Versionen von PrimeVue getestet, z. B. 3.1, 3.2, 3.3, aber der Fehler besteht immer noch. Daher sind die tatsächlichen Abhängigkeiten immer noch aktuell:

"primevue": "^3.7.0"

Möglicherweise gibt es bereits eine Lösung auf SO oder Google, aber entweder ist mein Englisch zu schlecht, um es zu verstehen, oder ich bin mit Vue.js nicht vertraut genug, um das Problem zu verstehen.

Vielen Dank im Voraus!

Answer 1

您对 app.use() 的使用方式是错误的：

app.use(
    router,
    PrimeVue,
    PrimeIcons,
    store
)

app.use() 只接受两个参数：

• 第一个参数：Vue 插件
• 第二个参数：插件选项

另外，PrimeIcons 不是一个插件，所以不应该传递给 app.use()。

解决方案

将每个插件单独传递给 app.use()：

app.use(router)
   .use(PrimeVue)
   //.use(PrimeIcons)   // 不是一个插件
   .use(store)