zoukankan      html  css  js  c++  java
  • 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.配置参数
  • 相关阅读:
    webService基本概念、元素及简单编码实现
    云服务器、vps、虚拟主机的区别
    SOAP和WSDL的一些必要知识
    密码学基础
    oracle执行计划
    dubbo学习笔记:快速搭建
    dubbo和zookeeper的关系
    查看wifi密码
    自动保存图表
    自定义颜色
  • 原文地址:https://www.cnblogs.com/cqkjxxxx/p/12940607.html
Copyright © 2011-2022 走看看