freeCodeCamp/use-default-props.chinese.md at ff8db8ce9e8413f490626e1572e7fd09825db39c

Files

Oliver Eyton-Williams 61460c8601 fix: insert blank line after ```

search and replace ```\n< with ```\n\n< to ensure there's an empty line
before closing tags

2020-08-16 04:45:20 +05:30

2.0 KiB

Raw Blame History

id, title, challengeType, isRequired, videoUrl, localeTitle

id	title	challengeType	isRequired	videoUrl	localeTitle
5a24c314108439a4d403616b	Use Default Props	6	false		使用默认道具

Description

React还有一个设置默认道具的选项。您可以将默认道具分配给组件作为组件本身的属性，如果需要，React会分配默认支柱。如果没有显式提供值，这允许您指定prop值应该是什么。例如，如果您声明MyComponent.defaultProps = { location: 'San Francisco' } ，则您已定义了设置为San Francisco字符串的位置道具，除非您另行指定。如果道具未定义，则React会指定默认道具，但如果您将null作为道具的值传递，则它将保持为null 。

Instructions

代码编辑器显示ShoppingCart组件。在此组件上定义默认道具，指定值为0的道具items 。

Tests

tests:
  - text: <code>ShoppingCart</code>组件应该呈现。
    testString: assert((function() { const mockedComponent = Enzyme.mount(React.createElement(ShoppingCart)); return mockedComponent.find('ShoppingCart').length === 1; })());
  - text: '<code>ShoppingCart</code>组件应具有<code>{ items: 0 }</code>的默认支柱。'
    testString: 'assert((function() { const mockedComponent = Enzyme.mount(React.createElement(ShoppingCart)); mockedComponent.setProps({items: undefined}); return mockedComponent.find(''ShoppingCart'').props().items === 0; })());'

Challenge Seed

const ShoppingCart = (props) => {
  return (
    <div>
      <h1>Shopping Cart Component</h1>
    </div>
  )
};
// change code below this line

After Test

console.info('after the test');

Solution

// solution required

/section>

2.0 KiB Raw Blame History Unescape Escape