# 5.5.18-nexter
按[1.3迭代](http://10.129.8.22:97/TemplatePage/V1.2/#g=1&p=基于布局新建的页面)修改左侧组件列表无可用组件时的样式


# 5.5.17-nexter
给组件传递环境变量`runtime`
```javascript
runtime = {
   type: 'ThunderPage', // or 'UIComponent'
   environmentData:{
       offsetTop: number // ThunderPage运行态专有
       // custom environment data
   } 
}
```
`offsetTop`是给ThunderPage的运行态使用的，因为接入公告会占用高度，会对高度占据一屏的ThunderPage组件产生影响

# 5.5.12-nexter
左侧组件列表搜索结果为空时，提示语修改为“这里什么都没有”。

# 5.5.12-nexter
预览态下，没有组件时不显示 `从左侧列表拖入组件`

## 5.5.11-nexter
应设计要求，组件之间的间距，改为12 24

## 5.5.6-nexter

内部在调用获取组件类的方法之后，将数据存入了一个内部缓存。下一次查找该组件的时候，直接从缓存中拿就行。但是遇到的一个问题就是，我们获取的组件类可能是外部传入的一个临时状态，如Loading，像这样的状态，是不能进入缓存的。所以加入了缓存判断的逻辑。
```
if(ComponentClass._disableCache){//某些中间的组件状态不需要进入缓存 如 Loading
    return ComponentClass;
}
this.setCache(ComponentClass, data);
return ComponentClass;
```

## 5.5.5-nexter
暂时去掉编辑态下的缓存逻辑，后期自定义开启是否缓存当前组件

## 5.5.4-nexter
组件异常监控：组件出错时，将组件信息和错误信息通过props同步传递给异常捕获组件

## 5.5.0-nexter

new feature : 添加组件的翻转功能
在组件类中定义如下的静态属性，指向组件类，那么该组件将作为反面渲染出来。并且正反面中接收`flipTrigger`方法，触发翻转
```javascript

class Back extends React.Component{
    handleClick=()=>{
        this.props.flipTrigger({text: 'hi i am back'})//触发翻转，同时该参数以flipData作为key通过props传递给正面。除了该props，其他的props与正面的一致
    }
    render(){
        return <div onClick={handleClick}>i am back<div>
    }
}

class Front extends React.Component{
    static backSide = Back//指定反面渲染的组件
    handleClick=()=>{
        this.props.flipTrigger({text: 'hi i am front'})//触发翻转，同时该参数以flipData作为key通过props传递给反面
    }
    render(){
        return <div onClick={this.handleClick}>i am front</div>
    }
}
```

## 5.4.0-nexter

new feature: 支持属性组件的自定义分组
component class 中的静态方法，通过返回如下格式的配置，来对属性自定义分组

```javascript
static getEditProps() {
    return {
        '基本信息': [
            {
                pType: Input,
                name: "编辑内容",
                key: "value"
            }
        ],
        '组件属性': [
            {
                pType: Input,
                name: "编辑名字",
                key: "name"
            }
        ]
    };
}
```
兼容之前的数据格式：当直接返回数组的时候，即默认分组：'属性配置'

## 5.3.1-nexter

new feature: 增加复制页面布局的特性，主要用于快速配置页面
API 如下：

```javascript
 pageLayoutsToFork = {[
    {
        label:'页面1',
        value:'code1'
    },
    {
        label:'页面2',
        value:'code2'
    }
]}//可以复制的页面布局
onPageLayoutSelected = {this.onPageLayoutSelected}//选择的回调
```

在回调函数中，可以调用`setContent`方法来重写元数据，快速复制该页面的数据

## 5.2.1-nexter

fix bug : view 下错误提示组件的支持

## 5.2.0-nexter

新增 API： `errorTipsComponent`
该参数接受一个 React 组件。当拖拽的组件内部报错的时，为了防止页面崩溃，而渲染的友好提示组件。

该组件接受一个 props： errorInfo, 指当前组件的报错信息。

如果不传该组件，则渲染内置的友好组件。

## 5.1.6-nexter

fix bug : 如果 A B 两个组件绑定了同一个属性组件，那么在这两个组件之间切换的时候，会导致属性组件重复渲染，而且 editableData 数据错位。本次主要解决掉这个 bug

## 5.1.5-nexter

fix bug: 修改 bug，支持组件的尺寸限制

## 5.1.4-nexter

fix bug : 默认的组件间隙设置

## 5.1.0-nexter

配置后端做元数据的结构调整，将 pageSettings 内无法编辑的字段抽出来放到 pageProperty 内。目前 pageSetting 内保存的字段只有 editableData。(待扁平化？)

## 5.0.0-nexter

API 变动，改造查找组件的方式，去掉了 components api, 增加 getComponents API，该方法接受一个参数，就是组件的元数据。开发者根据元数据返回需要渲染的组件。支持异步获取。

另外，如果想对组件的元数据做扩展，以便在渲染的时候使用，可以使用 API onCreateComponent。

## 4.3.0-nexter

API 变动。pageBuilder 之前接受的组件 components 的形式是：

```
components = {
    Button,
    Text
}
```

改造后的接受方式改为：

```
components = {
    appId1:{
        Button
    },
    appId2:{
        Text
    }
}
```

## 4.2.0-nexter

应产品和设计的需求，将组件边框调整为页面级别的边框设置。单个组件不再有边框属性设置。如果在页面上需要展示该边框属性设置，需要在模版中绑定该属性：

```java
static defaultTemplateProps = ["__background__","__toTop__","__gridItemMargin__","__border__"]
```

## 4.1.0-nexter

修改属性组件和组件的绑定方式，考虑到最小改动和兼容的原则，新的属性组件绑定方式如下：

```javascript
static getEditProps() {
    return [
        {
            pType: Input,//这里是需要渲染的属性组件类，当然需要import一下(之前是字符串)
            name: "编辑内容",
            key: "value"
        }
    ];
}
```

改动之后，在渲染 pageBuilder 的时候，propsComponents 可以不用传递了。之前的方式仍然是兼容的

## 4.0.0-nexter

防止出现老页面不兼容的情况，保证线上的稳定，新增了此版本（其实内部也做了兼容，为了防止万一)。本次升级的主要改动是调整组件间距的相关设置。新的后台管理上线后，页面组件间距可以在后台设置，这是默认的组件间距。在内部读取配置的时候，先读取 page 的 editable 字段，看是否设置过组件的间距，如果没有设置过，则取该默认的设置。

默认间距的设置的方法是通过 defaultProps 来指定：

```javascript
 defaultProps={{
    component: {
        __border__: {
            borderStyle: "shadow",
            hasBorder: false
        }
    },
    page:{
        __gridItemMargin__:10
    }
}}
```

编辑态下的组件间距设置属性组件暂不开放，但是次版本支持。开放的方式就是在模版组件中增加如下的静态属性：

```javascript
static defaultTemplateProps = ["__background__","__toTop__","__gridItemMargin__"]
```

## 4.0.16-beta

在页面模版中定义静态属性，来自定义需要显示的默认属性组件。如果不定义的话，则默认全部显示

```javascript
class FreeLayout extends Component {
    static defaultTemplateProps = ["__background__", "__toTop__"];
    render() {
        let { connectLayoutItem } = this.props;
        return connectLayoutItem("layout1", 8)(
            <div className="pg-tmpl-defaul" />
        );
    }
}
```

## 4.0.20-beta

在接入 page-builder 的时候，通过 props 参数`defaultProps`可以指定组件需要显示的内置默认属性，以及默认属性值。当不传的时候，默认显示内置默认属性`__border__`,属性值为`{borderStyle:'shadow',hasBorder:true}`

```javascript
defaultProps = {
    component: {
        __border__: {
            borderStyle: "shadow", // or solid
            hasBorder: true //or false
        }
    }
};
```

## 4.0.8-beta

*   grid margin 放在属性组建中，可配置

## 3.0.9

*   给组件配置默认数据 deletable=false，可以让组件不能被删除

### 3.0.8

*   修复了因为 sectionList 与 ComponentList 数据不对应导致页面挂掉的问题

### 3.0.6

*   模板添加`static useDefaultEditProps=false;` 可以关闭默认属性组件