Merge branch 'fix/rax-render-bugs' into 'release/1.0.37'

fix: rax渲染添加容器占位显示



See merge request !1169606
This commit is contained in:
无曰 2021-02-28 18:57:19 +08:00
commit 7de210a885
2 changed files with 28 additions and 0 deletions

View File

@ -194,6 +194,19 @@ class Renderer extends Component<{
const leaf = documentInstance.getNode(__id);
viewProps._leaf = leaf;
viewProps._componentName = leaf?.componentName;
// 如果是容器 && 无children && 高宽为空 增加一个占位容器,方便拖动
if (
!viewProps.dataSource &&
leaf?.isContainer() &&
(children == null || (Array.isArray(children) && !children.length)) &&
(!viewProps.style || Object.keys(viewProps.style).length === 0)
) {
children = (
<div className="lc-container-placeholder" style={viewProps.placeholderStyle}>
{viewProps.placeholder || '拖拽组件或模板到这里'}
</div>
);
}
// if (viewProps._componentName === 'Menu') {
// Object.assign(viewProps, {

View File

@ -83,6 +83,19 @@ html.engine-cursor-ew-resize, html.engine-cursor-ew-resize * {
justify-content: center;
}
.lc-container-placeholder {
min-height: 60px;
height: 100%;
width: 100%;
background-color: rgb(240, 240, 240);
border: 1px dotted;
color: rgb(167, 177, 189);
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
}
body.engine-document {
&:after, &:before {
content: "";
@ -110,10 +123,12 @@ body.engine-document {
user-select: text;
}
/* stylelint-disable-next-line selector-max-id */
#app {
height: 100vh;
}
.luna-page {
height: 100%;
}