javascript - 如何在 Knockout JS 更新 DOM 后运行代码

Question

作为我观点的一部分，我有:

<ul data-bind="foreach: caseStudies">
    <li><a data-bind="text: title, attr: { href: caseStudyUrl }"></a></li>
</ul>

一旦 knockout 更新了 DOM，我想运行一些第 3 方代码。

caseStudies(data);
thirdPartyFuncToDoStuffToCaseStudyLinks(); <-- DOM not updated at this point.

关于如何 Hook knockout 以在正确的时间调用它有什么想法吗？

Answer 1

使用 afterRender 绑定(bind)可以帮助您。

<ul data-bind="foreach: { data:caseStudies, afterRender:checkToRunThirdPartyFunction }">
    <li><a data-bind="text: title, attr: { href: caseStudyUrl }"></a></li>
</ul>


function checkToRunThirdPartyFunction(element, caseStudy) {
    if(caseStudies.indexOf(caseStudy) == caseStudies().length - 1){
        thirdPartyFuncToDoStuffToCaseStudyLinks();
    }
}