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

非元数据开发的页面我们在src/client/web/components/portal下编写，portal下的页面都当做一个单独的页面进行访问。

1、创建页面

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

图 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>
    )
  }
}

二、注册页面

使用platform公共路由；（线下和线上走支持）

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

import Hello from './portalDemo/hello';

const PortalComponents = {
  'hello': Hello
}

export default PortalComponents

三、访问使用

通过公共路由platform注册时，访问如下：

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

访问：http://local.yonyoucloud.com:3003/platform/hello

四、发布到线上环境

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

我的应用 -> 找到自己的应用 -> （点击）服务列表

添加自建服务

这里得url 就是${domain.iuap-mdf-node}/platform/hello?domainKey=XXX domainKey 为引擎编码

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)
})

门户页面扩展