diff --git a/packages/inula/__tests__/DomTest/Attribute.test.js b/packages/inula/__tests__/DomTest/Attribute.test.js
index 27e5becb..a216bc5b 100644
--- a/packages/inula/__tests__/DomTest/Attribute.test.js
+++ b/packages/inula/__tests__/DomTest/Attribute.test.js
@@ -95,4 +95,16 @@ describe('Dom Attribute', () => {
Inula.render(
, container);
}).not.toThrow();
});
+
+ it('dangerouslySetInnerHTML和children同时设置,只渲染children', () => {
+ Inula.act(() => {
+ Inula.render(
+
+ 123
+
,
+ container
+ );
+ });
+ expect(container.innerHTML).toBe('123
');
+ });
});
diff --git a/packages/inula/src/dom/validators/ValidateProps.ts b/packages/inula/src/dom/validators/ValidateProps.ts
index 2a6b27e1..18cf48c3 100644
--- a/packages/inula/src/dom/validators/ValidateProps.ts
+++ b/packages/inula/src/dom/validators/ValidateProps.ts
@@ -17,6 +17,25 @@ import { getPropDetails, PROPERTY_TYPE, PropDetails } from './PropertiesData';
const INVALID_EVENT_NAME_REGEX = /^on[^A-Z]/;
+const voidTagElements = [
+ 'area',
+ 'base',
+ 'br',
+ 'col',
+ 'embed',
+ 'hr',
+ 'img',
+ 'input',
+ 'keygen',
+ 'link',
+ 'meta',
+ 'param',
+ 'source',
+ 'track',
+ 'wbr',
+ 'menuitem',
+];
+
// 是内置元素
export function isNativeElement(tagName: string, props: Record) {
return !tagName.includes('-') && props.is === undefined;
@@ -108,6 +127,18 @@ export function validateProps(type, props) {
throw new Error('style should be a object.');
}
+ // 对于没有children的元素,设置dangerouslySetInnerHTML不生效
+ if (voidTagElements.includes(type)) {
+ if (props.dangerouslySetInnerHTML != null) {
+ delete props.dangerouslySetInnerHTML;
+ }
+ }
+
+ // dangerouslySetInnerHTML和children同时设置,只渲染children
+ if (props.dangerouslySetInnerHTML != null && props.children != null) {
+ delete props.dangerouslySetInnerHTML;
+ }
+
if (isDev) {
// 校验属性
const invalidProps = Object.keys(props).filter(key => !isValidProp(type, key, props[key]));