htmi 个人小网站 模板,网站开发用什么软件,加强政务门户网站建设,做废钢铁生意在哪个网站了解当我们将展平#xff08;传播#xff09;的属性设置子组件时#xff0c;我们会引入风险#xff0c;因为我们可能会往 HTML 标签上添加它不支持的属性。
坏实践 下面这个例子会在 DOM 元素上增加一个该元素本身不支持的属性flag。
const Sample () (Spread flag…当我们将展平传播的属性设置子组件时我们会引入风险因为我们可能会往 HTML 标签上添加它不支持的属性。
坏实践 下面这个例子会在 DOM 元素上增加一个该元素本身不支持的属性flag。
const Sample () (Spread flag{true} classNamecontent/); const Spread (props) (div {...props}Test/div); 良好实践 如果将 HTML DOM 元素需要接受的 props 分离出来再展开会是一种更安全的做法。
const Sample () (Spread flag{true} domProps{{className: content}}/); const Spread (props) (div {...props.domProps}Test/div); 或者我们也可以使用...rest去过滤掉那些HTML DOM不支持的属性。
const Sample () (Spread flag{true} classNamecontent/); const Spread ({ flag, ...domProps }) (div {...domProps}Test/div); 需要注意的是
在这种情况下当我们使用了PureComponent的时候即使domProps没有变化的时候组件还是会被重新渲染。因为PureComponent对于对象使用来说比较浅
