diff --git a/packages/omi/src/component.ts b/packages/omi/src/component.ts index c5651e121..761b270f6 100644 --- a/packages/omi/src/component.ts +++ b/packages/omi/src/component.ts @@ -160,12 +160,12 @@ export class Component extends HTMLElement { } attributeChangedCallback(name, oldValue, newValue) { - const propsName = camelCase(name) - if (this.constructor.props && this.constructor.props[propsName]) { - const prop = this.constructor.props[propsName] + const propName = camelCase(name) + if (this.constructor.props && this.constructor.props[propName]) { + const prop = this.constructor.props[propName] if (prop.changed) { - const newTypeValue = this.getTypeValueofProp(propsName, newValue) - const oldTypeValue = this.getTypeValueofProp(propsName, oldValue) + const newTypeValue = this.getTypeValueOfProp(propName, newValue) + const oldTypeValue = this.getTypeValueOfProp(propName, oldValue) prop.changed.call(this, newTypeValue, oldTypeValue) } } diff --git a/packages/omi/test/attrs-to-props.test.jsx b/packages/omi/test/attrs-to-props.test.jsx index b7b299621..8b630bef2 100644 --- a/packages/omi/test/attrs-to-props.test.jsx +++ b/packages/omi/test/attrs-to-props.test.jsx @@ -375,4 +375,33 @@ describe('attrs to props', () => { expect(parentElement.firstChild.shadowRoot.innerHTML).toBe('
18
') }) + it('updateProps2', async () => { + var valA, valB + class Ele extends Component { + static props = { + myAge: { + type: Number, + changed(newVal, oldVal) { + valA = newVal + valB = oldVal + } + }, + } + + render(props) { + return
{props.myAge}
+ } + } + + const node = genNode() + define(node.name, Ele) + const el = document.createElement(node.name) + parentElement.appendChild(el) + el.setProp('my-age', 18) + el.setProp('my-age', 19) + + expect(valA).toBe(19) + expect(valB).toBe(18) + }) + })