未定義のプロパティ「$primevue」がレンダリング中にアクセスされました
P粉476547076
2023-08-25 16:17:16
<p>ケースと質問</strong></p>
<p><code>Vue.js</code> を使用してプライベート プロジェクトに取り組んでいますが、<code>PrimeVue</code> の <code>FileUpload</ を使用しようとしたときに次のエラーが発生しました; code>コンポーネント: </p> の場合に発生します。
<pre class="brush:php;toolbar:false;">[Vue warn]: レンダリング中にプロパティ '$primevue' にアクセスされましたが、このプロパティはインスタンス上で定義されていません。 </pre>
<p>コンポーネントで <code>FileUpload</code> を使用しようとしています: </p>
<pre class="lang-html prettyprint-override"><コード><テンプレート>
<FileUpload name="demo[]" url="" @upload="onUpload" :multiple="true" :maxFileSize="1000000">
<テンプレート #empty>
<p>ここにファイルをドラッグ アンド ドロップしてアップロードします。 </p>
</テンプレート>
</ファイルアップロード>
</テンプレート>
</code></pre>
<p>このエラーは、<code>FileUpload</code> を使用しようとした場合にのみ発生します。これを削除すると、コンポーネントは正常に動作します。 <code>FileUpload</code> と <code>PrimeVue</code> は両方とも <code>main.js</code> にインポートされます: </p>
<pre class="lang-js prettyprint-override"><code>「vue」から {createApp} をインポートします
"./router" からルーターをインポートします。
「./store」からストアをインポートします。
「primevue/config」から PrimeVue をインポートします。
「primevue/config」から PrimeIcon をインポートします。
「./App」からアプリをインポートします;
const app = createApp(App);
app.use(
ルーター、
プライムビュー、
プライムアイコン、
店
）
'primevue/resources/primevue.min.css' をインポートします
'primeflex/primeflex.css' をインポートします
'primeicons/primeicons.css' をインポートします
'primevue/resources/主題/bootstrap4-dark-purple/theme.css' をインポートします
"primevue/card" からカードをインポートします。
「primevue/menubar」からメニューバーをインポートします。
「primevue/fileupload」から FileUpload をインポートします。
app.component('カード', カード)
app.component('メニューバー', メニューバー)
app.component('FileUpload', FileUpload)
app.mount('#app')
</code></pre>
<p>試したこと</strong></p>
<p>この問題を検索しましたが、このエラーに完全に一致するのは、GitHub 上の <code>Calendar</code> コンポーネントに関する古いクローズ済みの問題、問題 #808 だけでした。この問題は、新しい <code>PrimeVue API</code> の重大な変更によって発生します。 V3.1 で導入され、私は V3.7 を使用しているため、これは私の場合には当てはまりません。 </p>
<p>バージョンに問題がある場合は、<code>PrimeVue</code> のさまざまなバージョン (3.1、3.2、3.3 など) をテストしましたが、エラーは依然として存在します。したがって、実際の依存関係は依然として最新です: </p>
<pre class="brush:php;toolbar:false;">"primevue": "^3.7.0"</pre>
<p>SO または Google に解決策がすでに存在している可能性がありますが、私の英語力が低すぎて理解できないか、問題を理解できるほど <code>Vue.js</code> に精通していないかのどちらかです。 </p>
<p>よろしくお願いします！ </p>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
app.use()
の使用方法が間違っています: リーリーapp.use()
2 つのパラメータのみを受け入れます:- 最初のパラメータ: Vue プラグイン
- 2 番目のパラメータ: プラグイン オプション
また、PrimeIcons
各プラグインを個別にはプラグインではないため、app.use()に渡すべきではありません。＃＃＃解決＃＃＃app.use()
に渡します:リーリー