Php 如何在AJAX调用中从类访问wordpress建立的快捷码属性？

我开发了一个短代码，最初输出一些HTML，然后在页面加载时调用AJAX加载其他内容

最初的部分工作正常，从技术上讲，我得到了响应，但我似乎无法根据自定义的短代码参数获取内容

以下是我的代码的基本版本：

PHP

<?php

/**
 * Class AjaxShortcode
 */
class AjaxShortcode {

    public $atts;

    /**
     * @return array
     */
    public function getAtts() {
        return $this->atts;
    }

    /**
     * @param $atts
     */
    public function setAtts( $atts ) {
        $this->atts = $atts;
    }

    public function __construct() {
        add_shortcode( 'ajax_test', [ $this, 'output' ] );

        add_action( "wp_ajax_ajax_test", [ $this, 'ajaxDelayed' ] );
        add_action( "wp_ajax_nopriv_ajax_test", [ $this, 'ajaxDelayed' ] );
    }

    public function enqueueDelayScripts($atts) {
        wp_enqueue_script( 'ajax_test_js', plugins_url( '/js/ajax.js', dirname(__FILE__)), [], filemtime( plugin_dir_path( dirname(__FILE__)) .'js/ajax.js' ) );
        $data = [
            'ajax_url'     => admin_url( 'admin-ajax.php' ),
        ];
        foreach ($atts as $key => $att) {
            $data[$key] = $att;
        }
        wp_localize_script( 'ajax_test_js', 'data', $data );

    }


    /**
     * @param $atts
     * @return string
     * @throws Exception
     */
    public function output( $atts ) {
        $atts = shortcode_atts( [
            'att_1'       => '',
            'att_2'       => 'true',
            'att_3'       => 1000
        ], $atts, 'ajax_test' );
        $this->enqueueDelayScripts($atts);
        $this->setAtts($atts);

        echo '<h1>Initial Output</h1>';
    }

    /**
     * @param $atts
     * @return array 
     * @throws Exception
     */
    public function ajaxDelayedGetEvents($atts) {
        $atts = $this->getAtts();    

        $html = '';
        if (!empty($atts)) {
          foreach($atts as $att) {
            $html .= $att;
          }
        } else {
          $html = '<h3>I have been delayed</h3>';
        }

        $response = [];
        $response['html'] = $html;
        die(json_encode($response));
    }
}
new AjaxShortcode();

这总是返回第一个初始输出，但只有I被延迟

即使我输入这样的短代码：

[ajax_test att_1=“foo”att_2=false att_3=400]

---

ajax调用是否会触发对象的新实例？这就解释了为什么我不能访问getAtts（）中的变量。

我从错误的角度（服务器端/PHP）来这里，当我将变量存储在Javascript端时，它工作了

( function( $ ) {
    $( document ).ready(function(){
        var att_1 = data.att_1,
            att_2 = data.att_2,
            att_3 = data.att_3;

        //Perform Ajax request.
        $.ajax({
            url: data.ajax_url,
            type: 'POST',
            dataType: 'JSON',
            data: {
                action: 'ajax_test',
                att_1: att_1,
                att_2: att_2,
                att_3: att_3
            },
            success: function( response ) {
              console.log(data.html);
            }
        });
    });
}(jQuery) );

---

工作正常。

AJAX调用触发一个完全不同的请求。它与以前可能运行过的任何代码无关，也与访问未在原始脚本实例范围之外持久化的任何变量无关，但是关于如何访问这些参数有什么见解吗？让原始的短代码输出在HTML中传输必要的信息，这样AJAX代码部分就可以从那里获取它，并将它与它发出的请求一起传递…？将这些值放入单独的自定义数据属性中，或者将所有JSON编码到单个属性中，或者……添加_操作（“wp_ajax_ajax_test”[$this，'ajaxDelayed']）？这是错误的朋友正确的一个是我相信的输出在ajax结束后，你需要死（）；在函数的末尾

( function( $ ) {
    $( document ).ready(function(){
        var att_1 = data.att_1,
            att_2 = data.att_2,
            att_3 = data.att_3;

        //Perform Ajax request.
        $.ajax({
            url: data.ajax_url,
            type: 'POST',
            dataType: 'JSON',
            data: {
                action: 'ajax_test',
                att_1: att_1,
                att_2: att_2,
                att_3: att_3
            },
            success: function( response ) {
              console.log(data.html);
            }
        });
    });
}(jQuery) );