1. 程式人生 > >render函式介紹,以及 render: h => h(App)

render函式介紹,以及 render: h => h(App)

1 new Vue({
2 
3   router,
4   store,
5   //components: { App }  vue1.0的寫法
6   render: h => h(App)    vue2.0的寫法
7 }).$mount('#app')
複製程式碼

render函式是渲染一個檢視,然後提供給el掛載,如果沒有render那頁面什麼都不會出來

vue.2.0的渲染過程:

1.首先需要了解這是 es 6 的語法,表示 Vue 例項選項物件的 render 方法作為一個函式,接受傳入的引數 h 函式,返回 h(App) 的函式呼叫結果。

2.其次,Vue 在建立 Vue 例項時,通過呼叫 render 方法來渲染例項的 DOM 樹。

3.最後,Vue 在呼叫 render 方法時,會傳入一個 createElement 函式作為引數,也就是這裡的 h 的實參是 createElement 函式,然後 createElement 會以 APP 為引數進行呼叫,關於 createElement 函式的引數說明參見:Element-Arguments

結合一下官方文件的程式碼便可以很清晰的瞭解Vue2.0 render:h => h(App)的渲染過程。

[官方文件][1]

1 render: function (createElement) {
2     return createElement(
3       'h' + this
.level, // tag name 標籤名稱 4 this.$slots.default // 子元件中的陣列 5 ) 6 }

相關推薦

render函式介紹以及 render: h => h(App)

1 new Vue({ 2 3 router, 4 store, 5 //components: { App } vue1.0的寫法 6 render: h => h(App) vue2.0的寫法 7 }).$mount('#app')render函式是渲染一個檢視,然後提供給

[C++] STL庫函式之字串string::npos的介紹以及string中的find函式

npos經常和find一起用~它們兩個都在標頭檔案<string>裡面~先看用法: #include <iostream> #include <string> us

Vuejs2.0學習之二(Render函式,createElementvm.$slots函式化元件模板編譯JSX)

vue中的render函式,我在網上找了很多,下面這一篇文章最詳細 { // 和`v-bind:class`一樣的 API 'class': { foo: true, bar: false }, // 和`v-bind:style`一

Qt開發 槽函式定義以及函式二次響應多次響應問題

在Qt開發裡面,有一種傳說中的訊號槽機制,有好幾種實現的方法。 為了實現ui和邏輯的解耦,Qt開發可以利用Qt designer來做UI,同時也有一些UI和邏輯函式之間的通訊建立。 例如,要實現button的相應,有下面幾種方法:

函式介紹定義和呼叫

函式介紹 <1>什麼是函式 請看如下程式碼: print " _ooOoo_ " print " o8888888o " print "

一覽Swift中的常用關鍵字 Swift - final關鍵字的介紹以及使用場景

要學習Swift這門語言,就必須先了解Swift的關鍵字及對應的解釋。這裡就列一下在Swift中常用到的關鍵字。 關鍵字是類似於識別符號的保留字元序列,除非用重音符號(`)將其括起來,否則不能用作識別符號。關鍵字是對編譯器具有特殊意義的預定義保留識別符號。常見的關鍵字有以下4種。  與

Redis詳細介紹以及在SpringBoot中的簡單使用

1.Redis的特點:   (1)Redis支援資料的持久化,可以將記憶體中的資料儲存到磁碟中,下次啟動的時候可以直接載入磁碟中的資料;   (2)Redis不僅可以儲存key-value型別的資料,還可以儲存List、Set、hash、zset等資料結構的資料;

《連載 | 物聯網框架ServerSuperIO教程》- 14.配製工具介紹以及裝置驅動、檢視驅動、服務例項的掛載

目       錄 14.配製工具介紹,以及裝置驅動、檢視驅動、服務例項的掛載... 2 14.1        概述... 2 14.2        掛載裝置驅動... 2 14.3        掛載顯示檢視... 4 14.4 

kafka基本原理介紹以及重新選舉replica複製機制isr等。

最近做的專案,通過資料庫的log日誌將資料庫某些千萬量級的表(這些表需要聯表查詢)資料同步到elasticsearch中,以減輕資料庫的查詢壓力,其中以kafka作為訊息中介軟體,以下是做該專案過程中對kafka的一些整理。 一、中介軟體 中介軟體,用於業務對於資料的時效

Android Makefile中inherit-product函式簡介以及與include的區別

    在 Android Makefile 中時不時會看見 inherit-product 函式的使用,類似下方這樣:         $(call  inherit-product,  vendor/dolby/ds/dolby-product.mk)     從引數來

【無監督學習】DBSCAN聚類演算法原理介紹以及程式碼實現

前言:無監督學習想快一點複習完,就轉入有監督學習 聚類演算法主要包括哪些演算法?主要包括:K-m

Android---MVP模式介紹以及MVP與MVC的區別

(1). MVP模式簡介 相信大家對MVC都是比較熟悉了:M-Model-模型、V-View-檢視、C-Controller-控制器,MVP作為MVC的演化版本,那麼類似的MVP所對應的意義:M-Model-模型、V-View-檢視、P-Presenter-表示器。 從MV

nexus的倉庫介紹以及配置遠端倉庫

nexus搭建好了之後,在瀏覽器輸入:http://192.168.204.142:8081/nexus/#view-repositories 登入後並能管理自己的倉庫呢。 主介面如下: 倉庫介紹: 一般用到的倉庫種類是hosted、proxy、Hosted: hos

jaxb的介紹以及對jaxb的入門

介紹順序按照:1. JAXB的介紹 2. JAXB中的核心類以及相關類介紹    3. JAXB中的常用註解介紹 4. 使用演示展示 首先介紹下什麼是JAXB? JAXB(Java Architecture for XML Binding) 是一項可以根據XML Sch

MYSQL的鎖介紹以及死鎖發生情況-帶例子

  mysql鎖能在併發情況下的mysql進行更好的優化 MySQL有三種鎖的級別:頁級、表級、行級,這3種鎖的特性可大致歸納如下:  表級鎖:開銷小,加鎖快;不會出現死鎖;鎖定粒度大,發生鎖衝突的概率最高,併發度最低。 行級鎖:開銷大,加鎖慢;會出現死鎖;鎖定粒度最小,

Python 中如何獲取當前位置所在的檔名函式以及行號

在C/C++中可以分別使用 __FILE__ , __FUNCTION__ , __LINE__ 來得到當前位置所在的檔名,函式名,行號 在Python中可以通過模組sys中的函式來獲得當前位置所在的檔名,函式名,以及行號 import sys def function(

變數私有化和函式私有化以及私有化的好處

變數私有化為什麼變數要私有化?在一個結構良好的程式中,獨立的模組之間通過在模組間傳遞引數的函式呼叫來交換資料。在大多數情況下,尤其是剛開始養成程式設計習慣的時候,最好確保每個全域性變數不會被一個以上的模組引用。為了避免兩個模組引用同一個全域性變數的可能性,可以將變數私有化。變

1.socket程式設計:socket程式設計網路位元組序函式介紹IP地址轉換函式sockaddr資料結構網路套接字函式socket相關函式TCP server和client

 1Socket程式設計 socket這個詞可以表示很多概念: 在TCP/IP協議中,“IP地址+TCP或UDP埠號”唯一標識網路通訊中的一個程序,“IP 地址+埠號”就

.lib .dll .pdb 的簡單介紹以及除錯dll原始碼

.lib .dll檔案都是程式可直接引用的檔案,前者就是所謂的庫檔案,後者是動態連結庫(Dynamic Link Library)也是一個庫檔案。而.pdb則可以理解為符號表檔案,下文將會提到。對於程式引用.lib檔案一般有兩種方式:1、動態連結這種方式的基本原理是lib檔案

【除錯】列印函式以及函式指標輸出函式名的方法

Before All 以下皆在linux環境下。windows上用vs可隨時檢視函式棧。 使用者態 列印函式棧 使用backtrace()相關函式來達到輸出函式棧的目的,man backtrace檢視詳細的引數,返回值等資訊。 以下測試例,編譯