使用 ajax 的重复帖子加载更多 wordpress

Posted 2023-02-19

【中文标题】使用 ajax 的重复帖子加载更多 wordpress

【英文标题】：duplicate posts with ajax load more wordpress

【发布时间】：2022-01-22 12:14:40

【问题描述】：

滚动时，我的网站上有 ajax 加载帖子。问题在于重复帖子的出现。我不明白为什么会这样。只有一些帖子有重复。这是我在 function.php 中的代码：

    function loadmore_get_posts()
      $paged = !empty($_POST['paged']) ? $_POST['paged'] : 1;
      $paged++;
    
      $args = array(
        'paged' => $paged,
        'posts_per_page' => $_POST['posts_per_page'],
        'post_type'      => 'post',
        'post_status' => 'publish',
        'cat' => $_POST['cats']
        );
    
      query_posts($args);
     
      while( have_posts() ) : the_post();
        get_template_part( 'this is template' );    
      endwhile;
      die;
    
    add_action('wp_ajax_loadmore', 'loadmore_get_posts');
    add_action('wp_ajax_nopriv_loadmore', 'loadmore_get_posts');

这是原版 javascript 中的 ajax：

    let ajaxurl = '<?php echo admin_url('admin-ajax.php') ?>';
    let section_posts = 1;
    let postData = new FormData();
    
    postData.append('action', 'loadmore');
    postData.append('paged', section_posts);
    postData.append('posts_per_page', 9);
    postData.append('cats',  <?php print json_encode(get_selected_cats())?>);
    
      const xhr = new XMLHttpRequest();
      xhr.open('POST', ajaxurl);
    
      xhr.addEventListener('readystatechange', function (data) 
      if (this.readyState === 4 && this.status === 200) 
         section_posts++;
         document.querySelector('.articlefeed_template').innerhtml += data.target.responseText;
       else 
         xhr.send(postData);
      

请告诉我我错在哪里？谢谢！

【参考方案1】：

我建议不要使用query_posts，而是使用wp_query。

  function loadmore_get_posts()
    $paged = ! empty( $_POST['paged'] ) ? $_POST['paged'] : 1;
    $paged++;

    $args = array(
        'paged' => $paged,
        'posts_per_page' => $_POST['posts_per_page'],
        'post_type'      => 'post',
        'post_status' => 'publish',
        'cat' => $_POST['cats']
    );

    $data = new WP_Query( $args );
    $count_posts = $data->found_posts;

    while( $data->have_posts() ) : $data->the_post();
    get_template_part( 'this is template' );    
    endwhile;
    die;

add_action( 'wp_ajax_loadmore', 'loadmore_get_posts' );
add_action( 'wp_ajax_nopriv_loadmore', 'loadmore_get_posts' );

在这里，您还需要总帖子数，以在帖子完成后隐藏加载更多按钮。检查上面的代码，我在$count_posts变量中添加了。

你还没有通过offset？

在你的 JS 文件中也传递下面的参数

var total_post = '<?php echo $count_posts; ?>';

postData.append('offset', section_posts*9);
postData.append('totalPost', total_post);

在此处阅读有关offset 的更多信息

【讨论】：

感谢您的回答。但是滚动时不再出现帖子。这不起作用。

当滚动时，你必须告诉 AJAX 从第 10 篇文章开始你需要开始。并且该部分将由偏移处理。

而query_posts 会在这里产生问题。尝试使用WP_Query