Обратный вызов, когда DOM загружается в response.js

Я хочу, чтобы обратный вызов, вызванный для моего компонента response.js, когда элемент DOM (включая все дочерние узлы) фактически загружен на страницу и готов. В частности, у меня есть два компонента, которые я хочу отобразить один и тот же размер, выбирая максимум того, какой компонент имеет больший естественный размер.Обратный вызов, когда DOM загружается в response.js

Похоже, что componentDidMount на самом деле не так, потому что он вызывается только один раз для каждого компонента, но я хочу, чтобы мой callback вызывался снова в любое время, когда компонент завершил рендеринг. Я думал, что могу добавить событие onLoad в элемент DOM верхнего уровня, но, я думаю, это применимо только к некоторым элементам, например <body> и <img>.

источник

2014-09-26 brianmearns

Похоже, что комбинация componentDidMount и componentDidUpdate выполнит свою работу. Первый вызывается после первоначального рендеринга, когда DOM доступен, второй вызывается после любых последующих визуализаций, как только обновленная DOM доступна. В моем случае, я оба им делегировать на общую функцию делать то же самое.

источник

2014-09-26 12:50:23 brianmearns

Я применил компонентDidUpdate для таблицы, чтобы иметь все столбцы одинаковой высоты. он работает так же, как и в $ (window) .load() в jquery.

например:

componentDidUpdate: function() { 
     $(".tbl-tr").height($(".tbl-tr ").height()); 
    }

источник

2016-03-31 23:34:04

К сожалению, 'componentDidUpdate' не вызывается для начального render, поэтому ваша функция не будет применяться до тех пор, пока реквизит или состояние не будут изменены _hanged_: https://reactjs.org/docs/react-comp onent.html # componentdidupdate – brianmearns

Добавить OnLoad слушателя в componentDidMount

class Comp1 extends React.Component { 
constructor(props) { 
    super(props); 
    this.handleLoad = this.handleLoad.bind(this); 
} 

componentDidMount() { 
    window.addEventListener('load', this.handleLoad); 
} 

handleLoad() { 
    $("myclass") // $ is available here 
} 
}

источник

2017-05-02 13:34:09 John

В современных браузерах, она должна быть как

try() { 
    if (!$("#element").size()) { 
     window.requestAnimationFrame(try); 
    } else { 
     // do your stuff 
    } 
}; 

componentDidMount(){ 
    this.try(); 
}

источник

2018-02-14 11:25:50 pihyper

Хех, кроме современных браузеров, не используется jquery = P. Это хороший совет об использовании кадра анимации, хотя, предполагая, что это должно быть живое обновление. – brianmearns

Обратный вызов, когда DOM загружается в response.js

ответ

Смежные вопросы