Базовый
React — это «Library» JavaScript для создания пользовательского интерфейса. React — это не JavaScript «Framework».
Пользовательский интерфейс (UI)
DOM(«Объектная модель документа»). Это интерфейс программирования браузера для HTML и XML.
Код реакции
Это user
массив, который является стартовым.
import React from 'react';
const user: [
{ name: Pranto Shikder },
{ name: Sudipta Shikder },
];
<ul>
{user.map(user=>
<li>{user.name}</li>
)}
</ul>
Default Props
defaultProps
определяется как компонент класса свойств. Используется для undefined
реквизита или null
реквизита.
Типы реквизита
- install: npm install — сохранить prop-types
- Импортировать:
импортировать PropTypes из «prop-types»; // ES6
var PropTypes = require(‘prop-types’); // ES5 с npm
Использование типов реквизита
import React from 'react';
import PropTypes from 'prop-types';
class Greeting extends React.Component {
render() {
return (
<h1>Hello, {this.props.name}</h1>
);
}
}
Greeting.propTypes = {
name: PropTypes.string
};
PropTypes.checkPropTypes
Автоматически проверяйте эти prop-types на компоненте, но используя prop-types без React, затем вручную вызывайте этот PropTypes.checkPropTypes
.
PropTypes.resetWarningCache()
PropTypes.checkPropTypes(...)
только console.error
s данное сообщение один раз. Предупреждение об ошибке и вызов PropTypes.resetWarningCache().
Virtual-DOM и diffing работают в React
Понять, как строится DOM
Создайте этот DOM и рисуйте на экране, а также разберитесь со всеми этапами преобразования HTML в DOM.
Преимущества компонентов
«компонент», используемый фреймворками и библиотеками. Компоненты, использующие функции HTML5, такие как пользовательские элементы.
Кликабельное изображение
<a href=”https://google.com”> <img src=”google.png” /> </a>