web-dev-qa-db-ja.com

Vueカスタムコンポーネントタグを無視

私のサイトでは、Google CSE（googleによるカスタム検索エンジン）を使用しています。

これが私のHTMLです：

<div id="app">
  ...
  <gcse:search></gcse:search>
  ...
</div>
<script type="text/javascript">
    new Vue({ el: '#app' })
</script>

ご覧のように、vueアプリケーションの内部に「gcse入力」を配置しています。

したがって、警告が表示されます。

[Vue warn]：不明なカスタム要素：<gcse:search>

だから私の質問は、Vue.jsでこのカスタムコンポーネントを初期化しようとするのをどのように停止できるかということです。

前もって感謝します。

javascripthtmlvue.jsvue-component
16
abdulmanov.ilmir

Vueは、Vue gcse:searchという名前のコンポーネントをロードしようとしていると考えています。

このタグを無視するには、 v-preディレクティブ を追加します。

<gcse:search v-pre></gcse:search>

または、gcse:searchタグをVueの ignoredElements のリストに追加することもできます。

Vue.config.ignoredElements = ['gcse:search']
31
thanksd

thanksd の回答に加えて、ignoredElementsプロパティにこれらのタグを追加することで、不明なタグを無視できます。

Vue.config.ignoredElements = ['gcse:search']

また、文字列を使用する代わりに正規表現を使用して、これらのタグを無視することもできます。

Vue.config.ignoredElements = [/gcse:*/]

これは、特定のパターンを持つタグ/コンポーネントを無視したい場合に非常に役立ちます。この場合、「gcse」で始まるすべてのタグを無視できます。

0
Miguel Gonzalez