Multiple shortcodes only use attributes from one of the shortcodes on custom plugin

Question

Created a shortcode, however when multiple shortcodes are used on a page the $atts passed in are only from the last shortcode that was used. What am I doing wrong?

public function init(){
    add_action( 'wp_enqueue_scripts', 
        array( $this, 'load_dialog_scripts') );
    add_action( 'wp_enqueue_scripts',
        array( $this, 'load_dialog_styles') );
    add_shortcode( 'post-dialog-button', 
        array( $this ,'post_dialog_func') );
}
public function post_dialog_func( $atts ){

    $a = shortcode_atts( array(
        'button_image' => 'button image',
        'post_id' => 'some post id',
        'image' => 'post image here',
        'header' => 'post title here',
        'content' => 'post content here',
        'post_footer' => 'post footer info here',
    ), $atts );

    wp_localize_script( 'dialog-popup-script', 'dialog_popup_script', $a );

    wp_enqueue_script( 'dialog-popup-script' );

    $shortcode_button = '<div class="button-dialog-container">DEMO</div>';

    return $shortcode_button;
}

I was able to find an in depth answer to this same problem here: Localize variable for multiple Shortcodes

Answer 1

Each time you're using wp_localize_script you're replacing the values inside the dialog_popup_script object. If each popup requires different settings, and those settings are set on the shortcode, you might be better off storing the values as data attributes on the div.