Vue js：コンポーネントでテンプレート内に動的情報を表示

Question

私はegoist/vue-htmlプラグインを使用してHTMLをレンダリングしていますが、標準HTMLでは問題なく動作しますが、

たとえば、Breadcrumbコンポーネントをテンプレートに含めると、機能しません。私は間違って何をしていますか？

<script> 
import Breadcrumb from '~components/Breadcrumb' 
import Vue from 'vue' 
import HTML from 'vue-html' 

Vue.use(HTML) 

export default { 
    data() { 
    return { 
     html: '<div><Breadcrumb/></div>' 
    } 
    }, 
    render (h) { 
    return this.$html(this.html) 
    }, 
    components: { 
    Breadcrumb 
    } 
} 
</script> 

Answer 1

はハイフンでコンポーネント名を使用します。

これは私がこれまで持っているものです。 the draft specあたり：

カスタム要素タイプカスタム要素インターフェースを識別し、を必須がUを含む、NCNameで生産 [XML-NAMES]を一致させる必要があり、文字の 配列であります+ 002D HYPHEN-MINUS文字で、は ではないには大文字のASCII文字[HTML]が含まれていなければなりません。

• 注釈-XML
• カラープロファイル
• フォントフェイス
• フォントフェイス-SRC
• font-：カスタム要素 タイプはは、次のいずれかの値でなければなりませんface-uri
• fonts-face-format
• font-face-name
• 不明グリフ