在带有livewire 1.3的laravel 7中,加载页面时,我通过调用JS函数lazyImagesInit(使用了lazyload 2.0.0-rc.2)将分页和惰性图像应用于任何项目图像。但是,当我单击分页链接时,对于任何新打开的项目图像,我都会失去惰性图像效果。查看cach文件的代码,我发现使用了gotoPage方法:
<?php if(is_array($element)): ?>
<?php $__currentLoopData = $element; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $page => $url): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
<?php if($page == $paginator->currentPage()): ?>
<li class="page-item active d-none d-md-block" aria-current="page"><span class="page-link"><?php echo e($page); ?></span></li>
<?php else: ?>
<li class="page-item d-none d-md-block"><button type="button" class="page-link" wire:click="gotoPage(<?php echo e($page); ?>)"><?php echo e($page); ?></button></li>
<?php endif; ?>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
<?php endif; ?>
如果在调用gotoPage之后有办法调用我的lazyImagesInit函数?
谢谢!
覆盖goToPage()
组件上的方法-
public function gotoPage($page)
{
$this->page = $page;
$this->emit('goToPage');
}
现在,goToPage
用JavaScript 监听事件并调用lazyImagesInit
函数-
<script>
window.livewire.on('goToPage', () => {
lazyImagesInit();
});
</script>
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句