代码之家 › 专栏 › 技术社区 › Kosmetika

反应js-传递“null”时不使用默认属性

components reactjs javascript

Kosmetika · 技术社区 · 10 年前

我在React组件中有默认道具:

PropertyTitleLabel.defaultProps = {
    bedrooms: 1,
    propertyType: 'flat'
};
PropertyTitleLabel.propTypes = {
    bedrooms: PropTypes.number,
    propertyType: PropTypes.string
};

但当我经过的时候 null 到 bedrooms 例如:

const bedrooms = null; // in real world API returns `null`
<Component bedrooms={bedrooms} />

它没有被默认道具取代:(有什么想法吗?

3 回复 | 直到 10 年前

Jap Mul 7 年前

您可以更改 null 值为 undefined 以使用默认值。

<Component bedrooms={bedrooms || undefined} />

Preview 2pha 10 年前

我认为两者有区别 null 和 undefined 在处理 defaultProps 这个 无效的 值可以是预期的行为,因此不会被默认值替换,而 未定义 没有并且将被替换。

如文件所述

[…]用于确保这一点。如果父组件未指定值,则该值将具有一个值。

这是一个 related issue .

JasonGenX 5 年前

undefined =没有。
null =暗示“没有”的东西。

未定义 现实中并不存在。 无效的 然而确实存在。这意味着 未定义 不会传递prop值,因为你不能传递不存在的东西。自从 无效的 并不是什么都不是,而是一种只暗示什么都不是的东西,它只是道具。

推荐文章

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

Facundo Cabrera · 意外的应用程序错误!useNavigate()只能在<Router>组件的上下文中使用

1 年前

user29295031 · 如何使用react和vite覆盖Tailwinds css 4默认设计

1 年前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

1 年前

Luckkks · 过渡色工作不正常

1 年前

ModernEraCaveman · 如何对齐我的Bootstrap容器以适应网页的整个宽度?

1 年前

vatsal chauhan · 即使在字体预加载时,文本加载也很慢

1 年前

hasratyan · Next.js 15 API路由-动态路由中的无效GET导出错误[id]

1 年前

noblerare · Vite错误-未定义导出(SSR)

1 年前

ProfessorFinesse · 在默认表单中完成帖子请求时,“res.send”会去哪里?

1 年前