Vue3源码解析-defineComponent

defineComponent

从API名称来看，为定义一个组件

• 参数： 具有组件选项的对象：

import { defineComponent } from 'vue'

const MyComponent = defineComponent({
  data() {
    return { count: 1 }
  },
  methods: {
    increment() {
      this.count++
    }
  }
})

或者是一个setup函数，函数名称将作为组件名称来使用：

import { defineComponent, ref } from 'vue'

const HelloWorld = defineComponent(function HelloWorld() {
  const count = ref(0)
  return { count }
})

• 核心源码：

var Vue = (function (exports) {
    // 定义组件
    function defineComponent(options) {
	return isFunction(options) ? { setup: options, name: options.name } : options;
    }
    exports.defineComponent = defineComponent;  
}({}));

附录：github.com/fanqiewa/vu…