代码之家  ›  专栏  ›  技术社区  ›  James

WordPress将元素注入wp.element.createElement

  •  2
  • James  · 技术社区  · 7 年前

    我正在开发一个插件,它允许我们向ACF块系统添加块选项,并将字段保存在meta中。问题是我对js非常生疏,我不知道如何将我的循环合并到wp.element.create系统中。我在下面加入了我的javascript,并对我试图实现的目标进行了评论。在此方面的任何帮助都将不胜感激。

    jQuery(function(){
    
        var el = wp.element.createElement,
            Fragment = wp.element.Fragment
            registerBlockType = wp.blocks.registerBlockType,
            RichText = wp.editor.RichText,
            BlockControls = wp.editor.BlockControls,
            AlignmentToolbar = wp.editor.AlignmentToolbar,
            InspectorControls = wp.editor.InspectorControls;
    
        var withInspectorControls = wp.compose.createHigherOrderComponent( function( BlockEdit ) {
            return function( props ) {
    
                // Set data if it does not exist - needed when new page is created
                if(props.attributes.data === undefined){ props.attributes.data={}; }
    
                // begin creating the return element
                var elm = el(
                    Fragment,
                    {},
                    el( BlockEdit, props ),
                    el( InspectorControls, {},
                        el( PanelBody, { title: 'Accordion Options' },
    
                        // THIS IS WHERE THE ADDED ELEMENTS WILL GO
    
                    )
                );
    
                $.each(fields, function( key, field ) {
                    switch(field.type){
                        case 'text':
                            var optionField = el( TextControl, {
                                label: field.label,
                                help: field.instructions,
                                onChange: function(value){ 
                                    textField=value;
                                    props.setAttributes( { textField: value } ); 
                                }
                            });
    
    
                            // ADD optionField TO elm ABOVE CORRECTLY
    
    
                            break;
                        default: continue;
                    }
                });
                return elm;
            };
        }, 'withInspectorControls' );
    
        wp.hooks.addFilter( 'editor.BlockEdit', 'acf/accordion', withInspectorControls );
    }
    
    0 回复  |  直到 7 年前