木材 - AJAX呼び出し後の木材の\ postオブジェクトへのWordPress、追加データ（JSON）

Question

更新3 下記答えて見てください！

アップデート2

JS HTMLがretunredさ

add_action('wp_ajax_more_all_posts', __NAMESPACE__ . '\\ajax_more_all_posts'); 
add_action('wp_ajax_nopriv_more_all_posts', __NAMESPACE__ . '\\ajax_more_all_posts'); 
function ajax_more_all_posts() 
{ 

    $response = array(
     'data' => Timber::compile(array('templates/blocks/content.twig'), $context) 
    ); 
    wp_send_json($response); 


} 

$archiveLayout.on('click',loadMoreButtonID,function(){ 


     let pageCount = $(this).attr('data-page'), 
      nextPage = parseInt($(this).attr('data-page')) + 1; 



    let getParams; 

    _.each($loadMoreButton, function(item) { 
     let thisData = window.$(item).data() 
     getParams = thisData; 
    }); 

     console.log(getParams); 

    $.post(ajaxurl, getParams,function(response){ 
      // var json_obj = JSON.parse(res); 
      console.log(response); 
      console.log(response.data); 


     }).done(function(){ 

      $('#load-more').attr('data-page', nextPage); 
     }); 

}); 

PHPの機能を必要に応じて、リクエストに応じてそこにさらなる説明を提供しますが、それだけで1つのポストとデータだことができます小枝のマークアップに値を設定していません。

古い****

は、だから私のブログページに、私はより多くの記事をロードしたい、と私はちょうどページに配列aleady ポストに応答データを追加することができる場合、私は思ったんだけど。または、それを可能にするためにそれを特定の方法で構築する必要がある場合。

どのようなヒント/ヘルプなどがあれば幸いです。

{% for post in posts %} 
      {% set postCount = loop.index %}  


      {% set postImage = TimberImage(post.get_field('preview_image_post'))|resize('medium_large') %} 

      {% include "blocks/content.twig" with {post: post} %} 

     {% endfor %} 

出力のページへの投稿だけで罰金：私は私の小枝ファイル内で次のように設定している

以下

コードサンプル。

私は、次の操作を行って、AJAXリクエストを作る：

window.axios.get(fancySquaresRestUrl + 'wp/v2/posts', { 
      params: getParams 
     }) 
     .then(function (response) { 




      // append the entire repsonese? wasn't working, could be doing it wrong 

      _.each(response.data, function(post, index) { 

        //append each object on its own maybe??? 
      }); 




     }) 
     .catch(function (error) { 
      console.log(error); 
     }); 

Answer 1

次のように完全な答えは次のとおりです（これは木材/ Postオブジェクトには何も追加されていない、これは小枝ファイルに渡されたのGetデータからHTMLを追加している）

ご質問やおおよそを持っているコメント以下のコードは自由に聞くことができます。

jsが使用：

$archiveLayout.on('click',loadMoreButtonID,function(){ 


    var $this = $(this); 

    var pageCount = $(this).attr('data-pageCount'); 
    var nextPage = parseInt($(this).attr('data-page')) + 1; 

    var getParams = void 0; 

    _.each($loadMoreButton, function (item) { 
     var thisData = window.$(item).data(); 
     getParams = thisData; 
    }); 
    getParams.pagecount = pageCount; 
    // console.log(getParams); 

    $loader.fadeIn(); 
    $loadMoreButton.fadeOut(); 
    $.post(ajaxurl, getParams, function (response) { 
     // var json_obj = JSON.parse(res); 
     // console.log(response); 
     //console.log(response.data); 


     if(response === 'nomore'){ 
      $loadMoreButton.fadeOut(); 
     } else { 
      for(var hp = 0; hp < response.length; hp++){ 
       $('[data-js="append-content"]').append(response[hp].data); 
       $this.attr('data-pageCount', Number(pageCount)+1); 
      } 

      $loadMoreButton.fadeIn(); 
     } 


    }).done(function() { 
     $loader.fadeOut(); 
     // $('#load-more').attr('data-page', nextPage); 
    }); 

}); 

関数が呼び出されている：

add_action('wp_ajax_more_all_posts', __NAMESPACE__ . '\\ajax_more_all_posts'); 
add_action('wp_ajax_nopriv_more_all_posts', __NAMESPACE__ . '\\ajax_more_all_posts'); 
function ajax_more_all_posts() 
{ 

$cat_id = $_REQUEST[ 'cat' ] or $_GET[ 'cat' ]; 
$paged = $_REQUEST['pagecount']; 
$cat = $_REQUEST['dataCat']; 



$args = [ 
    'cat' => $cat_id, 
    'posts_per_page' => 9, 
    'post_status' => 'publish' 
]; 

if($paged != ""){ 
    $args['paged'] = $paged; 
} 

$posts = Timber::get_posts($args); 
$message = []; 
if($posts){ 
    foreach($posts as $post){ 
     $response = array(
      'data' => Timber::compile('templates/blocks/content.twig', ['post' => $post]) 
     ); 
     $message[] = $response; 
    } 
} else { 
    $message = "nomore"; 
} 
wp_reset_query(); 
wp_reset_postdata(); 

wp_send_json($message); 
die(); 
} 

Answer 2

私はすでに近い何かをしました。私のソリューションは、ajaxでレンダリングし、htmlを送信することでした。

だから私のアヤックスは、PHPと私はこれを行うPHPで呼び出します。私のAjaxがget_php_logicアクションを呼び出すこの例では

を。 phpアクションでは、私は最終的に私はJsonレスポンスとして返され、小枝を描画するロジックを行います。

このようにして、私のresponse.dataは追加または置換する準備ができています。