执行PHP代码段与Underscore.js

Question

我目前正在开发用于elementor扩展，我发现他们正在使用Underscore.js。我与开发商检查等执行PHP代码像wp_query，他们报以

content_template运行仅在编辑器和为Underscore template engine（JS），所以PHP不会在这里工作。

我想知道，如果有人知道的方式来扩展Underscore.JS以任何方式来执行PHP代码？

示例代码在PHP

while ( $wp_query->have_posts() ) : $wp_query->the_post();
    echo 'something';
endwhile;

Answer 1

我想你是误会，这些语言是如何工作的。 PHP执行服务器端，然后发送给客户端（浏览器）已经呈现。要执行PHP每一次，你必须点击服务器。

在另一方面JavaScript是一种客户端（浏览器）端语言意味着它被发送到客户端和客户端（浏览器）执行。

话虽这么说，有你在JavaScript“执行” PHP代码的几种方法。

第一种方式是执行PHP在响应被发送到客户端，但其隐藏，直到需要使用JavaScript。这有点一个黑客，而不是可扩展性，但是，在某些情况下，它可能工作。

第二种方式，我猜你会想用，就是AJAX。它会发送到后台服务器的请求，而无需重新加载页面。当然会有的，因为它需要服务器响应请求的时间延迟。

下面是一个例子AJAX调用与WordPress。

后端：

// Add the "fetch_posts" AJAX action.
add_action('wp_ajax_nopriv_fetch_posts', 'fetch_posts');
add_action('wp_ajax_fetch_posts', 'fetch_posts');


function fetch_posts() {
  if (isset($_POST['ids'])) {
    $html = '';
    // set $wp_query using the post ids sent.

    while ( $wp_query->have_posts() ) : $wp_query->the_post();
        $html .= 'something';
    endwhile; 

    wp_send_json_success($html);
  }
}

前端：

<div id="posts-container">
    <?php while ( $wp_query->have_posts() ) : $wp_query->the_post();
        echo 'something';
    endwhile; ?>
</div>

<br/><br/>

<a id="change-posts">Click Here</a>

<script>
  $('#change-posts').on('click', function() {
      // This is where you get to use the 'fetch_posts' action name that you created above.
      data = {
        ids: [147, 148, 149],
        action: 'fetch_posts'
      };

      $.ajax({
        url: "<?php echo admin_url('admin-ajax.php') ?>",
        method: "POST",
        data: data
      }).done(function(response) {
        $('#posts-container').html(response.data);
      });
  });
</script>