「后端小伙伴来学前端了」Vue脚手架中 render 函数

前言

上一篇文章写了：「后端小伙伴来学前端了」分析Vue脚手架结构

简单说明了Vue的脚手架结构，但是上篇文章还欠了个小点没有说完，就在这篇文章中补齐。就是所谓的render函数。

一、main.js中引入的原来是残缺版vue.js

我们来接着看看main.js这个入口文件。

代码语言：javascript复制

// 引入vue
import Vue from 'vue'
// 引入app组件
import App from './App.vue'

// 关闭生产提示
Vue.config.productionTip = false

// 创建 Vue 实例对象 Vm
new Vue({
  render: h => h(App) // 这里不是一下就能说完的，这里简单说下：
  // App 组件渲染，这里的 h 即是 vm.$createElement ,便是在vm.render这个阶段
  // 最粗略的理解，执行完这里，就是将app 放入了 容器中去了。
}).$mount('#app')
// Vue 的$mount()为手动挂载  这个也不是一下能说清，我也学艺不精，以后再补上 哈哈

这个代码，我想咱们只要创建过vue项目，大家肯定都写过了哈。

但是不知道大家有没有纠结过或者思考过new Vue() 中的 render:h=>h(App)是干什么。

（我是纯属刚学，好奇宝宝