Vue中h函数如何正确运用及深入解析？

本文共计1696个文字，预计阅读时间需要7分钟。

目录

一、认识

二、使用

1.h() 函数

2.实现一个计数器案例

3.函数组件和插槽的使用

三、JSX的使用

1.JSX 的认识

2.下载 Babel 插件支持 Vue（目前类似脚手架直接支持）

目录

• 一、认识
• 二、使用
• 1、h() 参数
• 2、简单的使用
• 3、实现一个计数器案例
• 4、函数组件和插槽的使用
• 三、jsx的使用
• 1、jsx的认识
• 2、下载Babel插件支持vue（现在貌似脚手架直接支持）
• 3、配置babel
• 4、简单的使用
• 5、计数器案例
• 6、组件和插槽的使用

一、认识

文档：v3.cn.vuejs.org/guide/render-function.html#dom-%E6%A0%91

​ h() 到底会返回什么呢？其实不是一个实际的 DOM 元素。它更准确的名字可能是 createNodeDescription，因为它所包含的信息会告诉 Vue 页面上需要渲染什么样的节点，包括及其子节点的描述信息。我们把这样的节点描述为“虚拟节点 (virtual node)”，也常简写它为 VNode 。