diantou/docs/styleguide-root.js

import zhCN from 'ant-design-vue/es/locale-provider/zh_CN'
import store from '@/common/store'
import { loginPromise } from './styleguide'
import SdWebflowPanel from '@/webflow/sd-webflow-panel.vue'
import flowService from '@/webflow/flow-service'

export default (previewComponent) => {
  return {
    store,
    components: {
      previewComponentWait: function(resolve, reject) {
        // 等待登录成功，vuex信息都已经获取后再渲染组件
        loginPromise.finally(() => {
          let component = previewComponent
          resolve({
            render(createElement) {
              return (
                <a-config-provider locale={zhCN}>
                  <component />
                </a-config-provider>
              )
            },
            created() {
              if (previewComponent.isFlowFormExample) {
                // 如果是流程样例，注册写死的表单ID，并用SdWebflowPanel显示
                flowService.addFlowForm(
                  'vue:doc/flowFormExample' + previewComponent._scopeId,
                  previewComponent
                )
                // 把当前实例的id传递到route param
                const createdOri = SdWebflowPanel.created
                component = {
                  ...SdWebflowPanel,
                  created() {
                    this.$route = {
                      fullPath: '/sd-webflow/pages/draft/404',
                      hash: '',
                      params: {
                        type: 'pages',
                        mode: 'draft',
                        id: '404',
                        scopeId: previewComponent._scopeId,
                      },
                      path: '/sd-webflow/pages/draft/404',
                      query: {},
                    }
                    createdOri.apply(this)
                  },
                }
              }
            },
          })
        })
      },
    },
    render(createElement) {
      return <previewComponentWait />
    },
  }
}