한동안 vue를 사용했다면 최신 버전의 CLI
에서 앱 파일의 렌더링
메서드를 접했을 수도 있습니다. > 기본값이며 main.js
파일에 있습니다: rendering
方法在你的app文件中 -- 在最新版本的 CLI
中它是一个默认值, 并且是在 main.js
文件中:
new Vue({ render: h => h(App) }).$mount('#app')
或者是,如果你使用了 render
方法(函数),可能会使用JSX:
Vue.component('jsx-example', { render (h) { return <p id="foo">bar</p> } })
或许你想知道,h
是用来干嘛的?它表示什么意思呢? h
代表的是 hyperscript 。它是HTML的一部分,表示的是 超文本标记语言:当我们正在处理一个脚本的时候,在虚拟DOM节点中去使用它进行替换已成为一种惯例。这个定义同时也被运用到其他的框架文档中。详情点击这里 Cycle.js。
在这个问题上,Evan 描述到:
Hyperscript 它本身表示的是"生成HTML结构的脚本"
缩写为 h 是因为它更容易去输入。 他还在 Frontend Masters 上描述了这一点 他的高级 Vue 研讨会 。
真的,你可以认为它是 createElement
的缩写。 这将是一个长长的形式:
render: function (createElement) { return createElement(App); }
如果我们用 h
render: function (h) { return h(App); }
render
메소드(함수)를 사용하는 경우 JSX를 사용할 수도 있습니다:
render: h => h (App)
h
가 무엇에 사용되는지 알고 싶으신가요? 그것은 무엇을 의미합니까? h
는 hyperscript
를 의미합니다. 이는 HTML의 일부이며 Hypertext Markup Language의 약자입니다. 스크립트 작업을 할 때 이를 사용하여 가상 DOM 노드를 대체하는 것이 관례가 되었습니다. 이 정의는 다른 프레임워크 문서에서도 사용됩니다. 자세한 내용은 여기 Cycle.js에 있습니다.Hyperscript 자체는 "HTML 구조를 생성하는 스크립트"를 의미합니다
createElement
의 줄임말이라고 생각하시면 됩니다. 이것은 긴 형식이 됩니다. render(h) { return h('p', {}, [...]) }
h
로 바꾸면 다음과 같이 할 수 있습니다. rrreee
... ES6를 사용하여 단축할 수 있습니다.rrreee
첫 번째는 요소 유형입니다(여기서는 p로 표시됨).
두 번째는 데이터 개체입니다. 여기에는 주로 props, attrs, dom props, class 및 style이 포함됩니다.세 번째는 하위 노드 세트입니다. 그런 다음 호출을 중첩하고 궁극적으로 가상 DOM 노드 트리를 반환합니다. 🎜🎜🎜🎜더 자세한 정보는 Vue 가이드에서 확인하실 수 있습니다. 🎜🎜이름 🎜 하이퍼스크립트 🎜는 일부 사람들에게 혼란을 줄 수 있습니다. 왜냐하면 하이퍼스크립트는 실제로 작은 생태계를 가지고 있는 라이브러리(요즘 업데이트되지 않음)의 이름이기 때문입니다. 이 경우 특정 구현에 대해 이야기하는 것이 아닙니다. 🎜🎜혼란스러우셨던 분들의 문제가 해결되길 바랍니다! 🎜🎜추천 튜토리얼: "🎜JS🎜"🎜위 내용은 Vue의 렌더링 방법에서 h는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!