【Vue】Cube-UI组件中create-api 模块的基本使用

1.这个模块的功能是什么？

官方文档是这样解释的：

该模块默认暴露出一个 createAPI 函数，可以实现以 API 的形式调用自定义组件。并且既可以在 Vue 实例上下文中调用，也可以在普通 js 文件中调用。
注： 所有通过 createAPI 实现的通过 API 的形式调用的自定义组件（cube-ui 内置的组件）都需要通过 Vue.use 注册才可以。

个人理解：就是通过这个这个模块将特定的组件注册为全局API模式调用，简化了组件的导入和注册，并且防止产生难以预料（?）的BUG.

2.用法

详细用法可参考官方文档，以下代码功能简单，但便于理解基本用法:

• 1.创建单独的注册 register.js 文件

// 导入 createAPI 模块
import { createAPI } from 'cube-ui'
// 导入Vue
import Vue from 'vue'
// 导入需要注册的组件
import HeaderDetail from 'components/header-detail/header-detail'

// 将 HeaderDetail 组件注册为全局API模式调用
createAPI(Vue, HeaderDetail)

• 2.在 main.js 中引入注册模块

// 导入API注册模块
import './register'

• 3.在需要使用此API注册组件的组件中通过 $create组件名 调用

      // 点击头部的时候通过调用API组件的方式显示头部详情
      // $create+HeaderDetail
      this.headerDetailComp = this.headerDetailComp || this.$createHeaderDetail({
        // 配置参数$props 
        // 是父组件向子组件传递数据，类似于直接在组件中绑定属性传值
        $props: {
          seller: 'seller'
        }
      })
      // 还可以调用API组件中的show()方法
      this.headerDetailComp.show()

• 4.配置参数