У меня следующая проблема, мне нужно вызвать функцию из одного компонента в другой.
У меня есть компонент X, где он проверяется, когда пользователь прокручивает сайт до конца, когда это происходит, вы можете выполнить действие, будь то предупреждение, setState или что-то еще.
container.onscroll = function () {
let height = this.clientHeight;
let scrollHeight = this.scrollHeight;
let scrollTop = this.scrollTop;
if (height + scrollTop === scrollHeight) {
_this.setState({ display: 'loader'});
funcionupdate() <--
setTimeout(function(){ _this.setState({ display: 'hidden'}); }, 2000);
}
}
С другой стороны, компонент Y, в котором есть функция update()
.
Как я могу выполнить функцию update()
компонента Y
из компонента X
?
Вы можете сделать это с помощью
Context
, для чего родительский контейнер должен содержать функцию для выполнения, когда прокрутка достигает вниз. В случае взаимодействующих компонентов, которые даже не являются братьями и сестрами, это было бы очень сложно. Лучший способ упростить задачу — реализовать шаблон проектирования Observer в своем приложении. Таким образом, вы можете установить связь между любой группой компонентов (а не только двумя). Вы можете использовать для этого такие библиотеки, как Postal.js , PubSub.js , MicroEvent.js или EventEmitter2 .Пример
Примечание: в примере используется библиотека Postal.js , которая, в свою очередь, зависит от lodash .