Блок Гутенберга показывает что-то, когда элемент выбран - PullRequest
Новая
       44

Блок Гутенберга показывает что-то, когда элемент выбран

0 голосов
/ 14 сентября 2018

Я строю блок Гутенберга и пытаюсь показать вход, когда выбран элемент. 

    <RichText
        tagName="a"
        className="button"
        placeholder={ __( 'Text...' ) }
        keepPlaceholderOnFocus={ true }
        value={ text }
        onChange={ ( value ) => setAttributes( { text: value } ) }
    />                      
   { isSelected && (

        <form
            className="inline-input"
            onSubmit={ ( event ) => event.preventDefault() }>
            <URLInput
            value={ URL }
            onChange={ ( value ) => setAttributes( { URL: value } ) }
         />
        </form>
  ) }

Когда выбран элемент с именем класса «кнопка», форма должна отображаться. Вместо этого форма показывает с самого начала. Я использую isSelected неправильно?

1 Ответ

0 голосов
/ 29 апреля 2019

Я все еще изучаю REACT для Gutenberg / Block Editor.Но мне удалось найти обходной путь для этого.

Вам нужно использовать условное IF для элемента (сокращение).Вы можете использовать className hidden, чтобы показать / скрыть элемент. 

 <form
        className={ !your_attribute ? "hidden" : "inline-input" }
        onSubmit={ ( event ) => event.preventDefault() }>
        <URLInput
        value={ URL }
        onChange={ ( value ) => setAttributes( { URL: value } ) }
     />
    </form>

isSelected используется, если пользователь щелкнул блок, чтобы сделать его «активным».Возможно, вы также можете использовать состояния в этом случае.Я просто обнаружил, что в форме будет отображаться, если пользователь выбрал кнопку, а затем сохранил свою запись / страницу.

Как уже упоминалось, я все еще изучаю REACT + Gutenberg / Block Editor.Надеюсь, это поможет.

...