Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

89. render: h => h(App) 具体含义解释 #90

Open
ly525 opened this issue Jul 3, 2018 · 0 comments
Open

89. render: h => h(App) 具体含义解释 #90

ly525 opened this issue Jul 3, 2018 · 0 comments
Labels

Comments

@ly525
Copy link
Owner

ly525 commented Jul 3, 2018

参见 关于Vue中的 render: h => h(App) 具体是什么含义?

# main.js
new Vue({
    el: '#app',
    router: router,
    store: store,
    render: h => h(App)
})

为了方便仍然有疑惑的人,贴一个链接, 其中 @bjunc 的解答可以作为该题的完美回答;

大概的翻译下:
render: h => h(App) 是下面内容的缩写:

render: function (createElement) {
    return createElement(App);
}

进一步缩写为(ES6 语法):

render (createElement) {
    return createElement(App);
}

再进一步缩写为:

render (h){
    return h(App);
}

按照 ES6 箭头函数的写法,就得到了:

render: h => h(App);

其中 根据 Vue.js 作者 Even You 的回复,h 的含义如下:

It comes from the term "hyperscript", which is commonly used in many virtual-dom implementations. "Hyperscript" itself stands for "script that generates HTML structures" because HTML is the acronym for "hyper-text markup language".

它来自单词 hyperscript,这个单词通常用在 virtual-dom 的实现中。Hyperscript 本身是指
生成HTML 结构的 script 脚本,因为 HTML 是 hyper-text markup language 的缩写(超文本标记语言)

个人理解:createElement 函数是用来生成 HTML DOM 元素的,也就是上文中的 generate HTML structures,也就是 Hyperscript,这样作者才把 createElement 简写成 h。

@ly525 ly525 added the Vue label Jul 3, 2018
@ly525 ly525 added Vue and removed Vue labels Jul 17, 2018
@ly525 ly525 changed the title 89. render: h => h(App) 具体含义解释 89. render: h => h(App) 具体含义解释 Dec 22, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant