fix: when designMode is not design, the hidden attribute does not take effect

This commit is contained in:
liujuping 2022-06-22 12:49:48 +08:00 committed by 林熠
parent ee7160ea3c
commit 3dd0b6d0a8
4 changed files with 99 additions and 7 deletions

View File

@ -367,7 +367,7 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
return null;
}
_leaf = _leaf || getNode(componentId);
_leaf = _leaf || getNode?.(componentId);
if (_leaf && this.curEventLeaf && _leaf !== this.curEventLeaf) {
this.disposeFunctions.forEach((fn) => fn());
this.disposeFunctions = [];
@ -513,7 +513,7 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
}
get leaf(): Node | undefined {
return this.props._leaf || getNode(componentCacheId);
return this.props._leaf || getNode?.(componentCacheId);
}
render() {

View File

@ -475,10 +475,6 @@ export default function baseRendererFactory(): IBaseRenderComponent {
// DesignMode 为 design 情况下,需要进入 leaf Hoc进行相关事件注册
const displayInHook = engine?.props?.designMode === 'design';
if (schema.hidden && !displayInHook) {
return null;
}
if (schema.loop != null) {
const loop = parseData(schema.loop, scope);
const useLoop = isUseLoop(loop, this._designModeIsDesign);

View File

@ -1121,3 +1121,20 @@ exports[`JSExpression base props 1`] = `
/>
</div>
`;
exports[`designMode designMode:default 1`] = `
<div
className="lce-page"
style={Object {}}
>
<div
className="div-ut"
forwardRef={[Function]}
>
<div
className="div-ut-children"
forwardRef={[Function]}
/>
</div>
</div>
`;

View File

@ -7,7 +7,7 @@ import components from '../utils/components';
const Renderer = rendererFactory();
function getComp(schema, comp = null): Promise<{
function getComp(schema, comp = null, others = {}): Promise<{
component,
inst,
}> {
@ -17,6 +17,7 @@ function getComp(schema, comp = null): Promise<{
<Renderer
schema={schema}
components={components as any}
{...others}
/>);
const componentInstance = component.root;
@ -321,4 +322,82 @@ describe('JSExpression', () => {
done();
});
})
});
describe("designMode", () => {
it('designMode:default', (done) => {
const schema = {
componentName: 'Page',
props: {},
children: [
{
componentName: "Div",
props: {
className: 'div-ut',
children: [
{
componentName: "Div",
visible: true,
props: {
className: 'div-ut-children',
}
}
]
}
}
]
};
getComp(schema, components.Div).then(({ component, inst }) => {
expect(inst.length).toBe(2);
expect(inst[0].props.className).toBe('div-ut');
expect(inst[1].props.className).toBe('div-ut-children');
componentSnapshot = component;
done();
});
});
it('designMode:design', (done) => {
const schema = {
componentName: 'Page',
props: {},
children: [
{
componentName: "Div",
id: '0',
props: {
className: 'div-ut',
children: [
{
componentName: "Div",
id: 'hiddenId',
hidden: true,
props: {
className: 'div-ut-children',
}
}
]
}
}
]
};
getComp(schema, components.Div, {
designMode: 'design',
getNode: (id) => {
if (id === 'hiddenId') {
return {
export() {
return {
hidden: true,
};
}
}
}
}
}).then(({ component, inst }) => {
expect(inst.length).toBe(1);
expect(inst[0].props.className).toBe('div-ut');
done();
});
});
})