MDF4.1脚手架扩展门户页面

非元数据开发的页面我们在src/client/web/components/portal下编写,portal下的页面都当做一个单独的页面进行访问。(适用于本地联调)

1、创建页面

我们在portal下创建自定义扩展文件夹容器portalDemo(用来放置扩展某一类门户页面);

undefined

图 1

我们在portal/portalDemo下增加个hello.jsx,在里面输入这是一个PC组件Hello!


import React, { Component } from 'react';

import './hello.less';

export default class Hello extends Component {
  render() {
    return (
      <div className='portal-hello'>这是一个PC组件Hello!</div>
    )
  }
}

二、注册页面

两种注册方式:(推荐第二种)

一、使用自定义配置路由(需要配合第三步配置路由一起使用)只适用于线下调试 src/client/web/components/portal下的index页面,将新写的组件注入进去

export Hello from './portalDemo/hello';

二、使用platform公共路由,无需配置第三步;(线下和线上走支持)

src/client/web/components/portal下的index页面,将新写的组件注入进去

import Hello from './portalDemo/hello';

const PortalComponents = {
  'hello': Hello
}

export default PortalComponents

三、配置路由

扩展的页面路由需要配置两处:

1.1:在src/web/routes/index.jsx里面配置(如图2)

undefined

图 2

1.2:在公共配置文件下src/common/config.env.js里面配置(如图3)

undefined

图 3

四、访问使用

一、通过自定义路由注册时,访问如下:

访问节点 /hello,就可以访问到刚刚编写的页面组件.这里的hello,就是刚刚注入的Hello组件对应的keys字段。

访问:http://local.diwork.com:3003/hello

二、通过公共路由platform注册时,访问如下:

访问节点 /platform/hello,就可以访问到刚刚编写的页面组件.这里的hello,就是刚刚注入的Hello组件对应的keys字段

访问:http://local.diwork.com:3003/platform/hello

五、发布到线上环境

* 发布到线上环境时,需要使用公共路由platform得方式配置路由

我的应用 -> 找到自己的应用 -> (点击)服务列表
图

添加自建服务 图
图
*这里得url 就是/platform/hello

F5刷新页面,就可以正常访问了
图

五、如何在扩展页面请求接口数据?

cb.rest.DynamicProxy

无ViewModel时的情况,需要自行传入domainKey参数; params:需要上送的参数对象

// 声明
var proxy = cb.rest.DynamicProxy.create({
  ensure: {
    url: '/xxx/xxx/autoPick',
    method: 'POST'
  }
});
// 调用
proxy.ensure(params, function (err, result) {
  console.log('success', result)
}
Copyright © 用友 -【生态技术部】 2022-2023 all right reserved,powered by Gitbook修订时间: 2022-09-22 19:43:27

results matching ""

    No results matching ""