React: все о новом предложении — хуке use()

[mclander]

С одной стороны классная идея. Код получается очень компактный. С другой пугает громкое название. Сразу вспоминается патентованный болеутолитель из Тома Сойера.

Ну и обработка ошибок не раскрыта.

[aelaa]

https://ru.wikipedia.org/wiki/Объект_первого_класса

"Первоклассный" в русском языке - показатель высокого качества. А тут про категорию объектов языка.

[DmitryKoterov]

Мне кажется, все это уже начало обрастать бородой и приближаться к вымиранию, как динозавры, да и Дэн Абрамов не молодеет, увы. Хуки были когда-то гигантским прорывом по сравнению с класс-компонентами, так же, как теория Ньютона была прорывом по сравнению с тем, что было до ней. Но потом пришла теория относительности и сделала ньютоновскую механику архаичным частным случаем. То же должно произойти и с хуками - ну уж слишком там много волос торчит отовсюду.

Причем что там «за хуками», непонятно. Еще не изобрели. Но изобретут обязательно.

Еще мысль: явно будущее все еще за промисами и AsyncIterables. Точно не за Observables. Массовое сознание никогда не грокнет Observables, слишком большой порог на вход. Они уже практически убили Angular (его много что убило, но и это тоже).

[djEban]

На чем основана аналитика?

[nin-jin]

Отличная новость, фича из $mol от 2016 года наконец добирается и до React. Правда в довольно кривом виде, прибитом гвоздями к шаблонам, и с кучей ограничений. Почему бы уже не взять $mol_wire и перестать менять апи каждый год? Вот пример модели и вьюшки оттуда:

export class GitHub extends Object {
	
	@mems static issue( value: number, reload?: "reload" ) {
		
		sleep(500) // for debounce
		
		return getJSON( `https://api.github.com/repos/nin-jin/HabHub/issues/${value}` ) as {
			title: string
			html_url: string
		}
		
	}
  
}

export class Counter extends Component<Counter> {
  @mem numb(value = 48) {
    return value;
  }

  issue(reload?: "reload") {
    return GitHub.issue(this.numb(), reload);
  }

  title() {
    return this.issue().title;
  }

  link() {
    return this.issue().html_url;
  }

  compose() {
    return (
      <div id={this.id} className="counter">
  
        <InputNumber
          id={`${this.id}-numb`}
          numb={(next) => this.numb(next)} // hack to lift state up
        />

        <Safe
          id={`${this.id}-title-safe`}
          task={() => (
            <a
              id={`${this.id}-title`}
              className="counter-title"
              href={this.link()}
            >
              {this.title()}
            </a>
          )}
        />

        <Button
          id={`${this.id}-reload`}
          action={() => this.issue("reload")}
          title={() => "Reload"}
        />

      </div>
    );
  }
}