null
. Uma coisa importante a notar é que React requer que o nome da sua função comece com uma letra maiúscula. Aqui está um exemplo de um componente funcional sem estado que atribui uma classe HTML no JSX: // Depois de ser transpilado, o <div> terá uma classe CSS de 'customClass'Como um componente JSX representa o HTML, você pode colocar vários componentes juntos para criar uma página HTML mais complexa. Essa é uma das principais vantagens da arquitetura de componentes que o React fornece. Ele permite que você componha sua interface do usuário de vários componentes separados e isolados. Isso facilita a criação e manutenção de interfaces de usuário complexas.
const DemoComponent = function () {
Retorna (
<div className = 'customClass' />
);
};
MyComponent
. Complete esta função para que ela retorne um único elemento div
que contenha alguma cadeia de texto. Nota: O texto é considerado um filho do elemento div
, portanto, você não poderá usar uma tag de fechamento automático. MyComponent
deve retornar o JSX.
testString: 'assert((function() { const mockedComponent = Enzyme.mount(React.createElement(MyComponent)); return mockedComponent.length === 1; })(), "MyComponent
should return JSX.");'
- text: MyComponent
deve retornar um elemento div
.
testString: 'assert((function() { const mockedComponent = Enzyme.mount(React.createElement(MyComponent)); return mockedComponent.children().type() === "div" })(), "MyComponent
should return a div
element.");'
- text: O elemento div
deve conter uma string de texto.
testString: 'assert((function() { const mockedComponent = Enzyme.mount(React.createElement(MyComponent)); return mockedComponent.find("div").text() !== ""; })(), "The div
element should contain a string of text.");'
```