169 похожих чатов

При каждом рендере компонента будет дергаться ссылка на функцию handleClick class

App {
handleClick = () => {}

render() {
return <button onCLick=(this.handleClick)>
}
}

При каждом рендере компонента будет создана новая функция
class App {
render() {
return <button onCLick=(() => {})>
}
}

Тут будет создаваться каждый раз новая функция ?
const Test = () => {
return <button onCLick=(() => {})>
}

4 ответов

5 просмотров

Ой не мы тут классы не юзаем

const App = () => { const fn = () => {} return <Child fn={fn} /> } const App = () => <Child fn={() => {}} /> два абсолютно идентичных компонента с идентичным поведением

Будет создаваться новая функция и в том и в том случае

class App { // Присваиваем полю класса функцию; // поле класса неизменно между рендерами // (если мы явно не изменяем), // поэтому сохраняется ссылочное равенство handleClick = () => {}; render() { return <button onClick={this.handleClick} {...this.props} />; } } class App { render() { // Каждый рендер создаём новую функцию; // теряем ссылочное равенство // между рендерами const handleClick = () => {}; return <button onClick={handleClick} {...this.props} />; } } class App { render() { // Каждый рендер создаём новую функцию; // теряем ссылочное равенство // между рендерами return <button onClick={() => {}} {...this.props} />; } } // Помни! // Функциональный компонент — просто // метод render без класса! (Ментальная модель такая, // в действительности всё может быть чуточку сложнее) const App = (props) => { // Каждый рендер создаём новую функцию; // теряем ссылочное равенство // между рендерами const handleClick = () => {}; return <button onClick={handleClick} {...props} />; } const App = (props) => { // Каждый рендер создаём новую функцию; // теряем ссылочное равенство // между рендерами return <button onClick={() => {}} {...props} />; }

Похожие вопросы

Обсуждают сегодня

Типа вызывать GetParent и проверять на соответствие GetModuleHandle?
The Bird of Hermes
67
Do any of you guys have interesting projects one could join? I'm a Middle Full-Stack developer (JS/TS, React & Node)
Lev Shapiro
40
$res = json_decode($наша строка из респонса); $res1 = array_map(fn($o) => $o->name, $res->breadcrumbs[0]->entities); Как такое будет на Хаскеле?.. В начале весь джейсон, в ко...
Хаскель Моисеевич Гопник
27
В чем сила брат, в NASM или FASM?
Isaac Kleiner
18
Вопрос по диагностике ошибок (я знаю в чем, в данном конкретном примере, я знаю, как исправить, пример модельный, понятно, что в реальности бывает намного запутаннее). module...
ⰄⰎⰋⰐⰐⰑⰛⰤⰧⰧⰩⰄ ⰊⰑⰁⰓⰡⰛⰦⰕⰫ
11
Хтось використовував Vapor на Windows?
Jaroshevskii
15
А чем вам питонисты не угодили?😂
.
79
Есть какой-нибудь для Delphi/FPC T*Compression(Decompression)Stream на базе LZ4/Zstd/любой другой быстрый(и хорошо сжимающий) алгоритм А ещё лучше в pure pascal А ещё лучше од...
notme
52
Тут кста кто-нибудь NeoVim использует?
Simple Sorcerer
13
Оба варианта в целом подходят, но скорее создание конфликтной ситуации (на пустой основе). В прошлый раз он сказал мне про ESP32, я забыл про этот микроконтроллер, ошибся, я п...
КТ315
4
Карта сайта