diff --git a/CHANGELOG.md b/CHANGELOG.md index 23d98919..e67f773f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,8 @@ +## 0.0.40 (2023-03-08) +- **core**: #103 使用Memo、React.forwardRef包装组件后,defaultProps失效 +- **core**: #104 --max-segment-num的style无法使用 +- **core**: 状态管理器的优化 + ## 0.0.39 (2023-02-21) - **core**: #102 使用eview-react组件Dialog时,关闭组件horizon报错,且无法再打开弹框 diff --git a/libs/horizon/package.json b/libs/horizon/package.json index d70cdf4c..7393bdbc 100644 --- a/libs/horizon/package.json +++ b/libs/horizon/package.json @@ -4,7 +4,7 @@ "keywords": [ "horizon" ], - "version": "0.0.39", + "version": "0.0.40", "homepage": "", "bugs": "", "main": "index.js", diff --git a/libs/horizon/src/dom/DOMPropertiesHandler/StyleHandler.ts b/libs/horizon/src/dom/DOMPropertiesHandler/StyleHandler.ts index 012f438f..c3954fa1 100644 --- a/libs/horizon/src/dom/DOMPropertiesHandler/StyleHandler.ts +++ b/libs/horizon/src/dom/DOMPropertiesHandler/StyleHandler.ts @@ -54,8 +54,12 @@ export function setStyles(dom, styles) { const style = dom.style; Object.keys(styles).forEach(name => { const styleVal = styles[name]; - - style[name] = adjustStyleValue(name, styleVal); + // 以--开始的样式直接设置即可 + if (name.indexOf('--') === 0) { + style.setProperty(name, styleVal); + } else { + style[name] = adjustStyleValue(name, styleVal); + } }); } diff --git a/libs/horizon/src/renderer/render/MemoComponent.ts b/libs/horizon/src/renderer/render/MemoComponent.ts index 32aa4bf3..74bf093e 100644 --- a/libs/horizon/src/renderer/render/MemoComponent.ts +++ b/libs/horizon/src/renderer/render/MemoComponent.ts @@ -31,7 +31,9 @@ export function bubbleRender() {} export function captureMemoComponent(processing: VNode, shouldUpdate: boolean): VNode | null { const Component = processing.type; // 合并 函数组件或类组件 的defaultProps - const newProps = mergeDefaultProps(Component, processing.props); + let newProps = mergeDefaultProps(Component, processing.props); + // 解决Horizon.memo(Horizon.forwardRef(()=>{}))两层包装的场景 + newProps = mergeDefaultProps(Component.type, newProps); if (processing.isCreated) { let newChild: VNode | null = null; diff --git a/scripts/__tests__/ComponentTest/FunctionComponent.test.js b/scripts/__tests__/ComponentTest/FunctionComponent.test.js index 717a0d2f..2c8dedf9 100644 --- a/scripts/__tests__/ComponentTest/FunctionComponent.test.js +++ b/scripts/__tests__/ComponentTest/FunctionComponent.test.js @@ -60,4 +60,34 @@ describe('FunctionComponent Test', () => { expect(realNode).toBe(null); }); + it('测试函数组件的defaultProps:Horizon.memo(Horizon.forwardRef(()=>{}))两层包装的场景后,defaultProps依然正常', () => { + const App = () => { + return ; + }; + + const DefaultPropsComp = Horizon.forwardRef(props => { + return
{props.name}
; + }); + DefaultPropsComp.defaultProps = { + name: 'Hello!', + }; + const DefaultPropsCompMemo = Horizon.memo(DefaultPropsComp); + + Horizon.render(, container); + expect(container.querySelector('div').innerHTML).toBe('Hello!'); + }); + + it('测试', () => { + const App = () => { + return ; + }; + + const StyleComp = props => { + return
{props.name}
; + }; + + Horizon.render(, container); + expect(container.querySelector('div').style['_values']['--max-segment-num']).toBe(10); + }); + });