如何在"Additional CSS Class"输入上触发"change"事件

Question

我使用JS填充额外的CSS类输入，这工作得很好(即文本输入字段的值正在设置)，但是它没有通知Gutenberg该值已被更新，并且它不保存编程填充的值。我试过:

classField.trigger( 'change' );
classField.trigger( 'input' );

…它们会着火，但对古腾堡没有影响。什么好主意吗?

*UPDATE(尚未生效)

wp.domReady( function() {
jQuery('body').on( 'change', '.acf-field[data-name=col_size] select', function() {
var clientId = jQuery(".wp-block.is-selected").attr("data-block");
wp.data.dispatch( 'acf/column' ).updateBlockAttributes( clientId, { className:'my-style' } );
});
});

Answer 1

要使用目标块clientId来更新块的className属性，请通过以下方式调用WordPress来保存更改:

wp.data.dispatch( 'core/block-editor' ).updateBlockAttributes( clientId, { className:'my-style' } );

clientId存储在呈现的HTML的data-block值中，例如。表块:

<figure 
... 
data-block="{clientId}" 
data-type="core/table" 
data-title="Table"
>

裁判:https://developer.wordpress.org/block-editor/reference-guides/data/data-core-block-editor/