レンダリングレンダリングvue.jsデータ

関数がやっているレンダリング？（VUE公式説明を入力します）

• 簡単に言えば、我々はページを設定VUE HTML構文でテンプレートを使用して、我々はレンダリング機能を使用するDOMのJSを構築するために言語を使用することができます

• VUEは、仮想DOMがあるので、テンプレートも機能vノードに変換する場合、そのテンプレートを取得して、翻訳プロセスを排除することで、DOM関数は、レンダリングVUEを構築します。

• レンダリング機能を使用すると、仮想DOMを説明すると、VUEは、仮想DOMの必要性を構築するためのツールである機能を提供します。公式サイトは彼に名前与えたのcreateElementを。大会は、hと呼ばれる存在速記しました、

• VMはメソッド_Cを持って、この関数はエイリアスです

• https://www.cnblogs.com/weichen913/p/9676210.htmlから借用

機能紹介をレンダリング

• この関数は、関数をレンダリングレンダリング、それは、それはパラメータの関数も関数である - というのcreateElement
• 関数であるパラメータであるレンダリングのcreateElement 関数自体、および3つのパラメータがあります
• createElement関数の戻り値は、vノードである（例：仮想ノード）

基礎となるコードの説明：

「」「コードは、説明の記事を詳細に」

：コードの最も基本的な最初の引数、必要な

/*----------------------html----------------------------*/

    <div id="root">你好！</div>
    
/*----------------------js----------------------------*/
    new Vue({
        el:"#root",

        render(createElement){
            return createElement("h1","我是热爱学习人，因为学习使我快乐！");
            					//第一个值是 标签 ，第二个是你的内容
        }
    })

：結果は

divのコンテンツが上書きされるの内側にあなたはh1はそれにレンダリングされた見ることができますが、我々が見つかりました。

---

組み合わせて使用​​してアセンブリをレンダリング

/*----------------------html----------------------------*/

    <div id="root">你好！</div>
    
/*----------------------js----------------------------*/
    new Vue({
        el:"#root",
        components:{
            App:{
                template:`<div>我是一个名字为App的组件</div>`
            }
        },
        render(createElement){
            return createElement("App");
        },
    })

• ここでの戻りのcreateElement（「アプリケーション」）は、二重引用符で囲む必要があります
• それ以外の場合は、定義のAppを取ります

    const App = {
        template:`<div>我是一个定义 在外部的App组件</div>`
    }

結果は：