Подтвердить что ты не робот

Ссылка на бумажный элемент внутри кнопки меню (Polymer-1.0)

update 1: нашел эту проблему с запросом на перенос, который, похоже, решает эту проблему в Polymer.

update 2. Решено перестроить мой макет на основе Polymer Starter Kit, который вместо этого использует page.js из приложения-маршрутизатора и, кажется, работают хорошо, хотя они не используют бумажный элемент в меню бумаги, а вместо этого используют пользовательские элементы привязки.

Искать каждую бит документации, но я не могу найти ее (хотя есть qaru.site/info/415825/... с почти одним и тем же названием, не то же самое)

TL;DR: мне нужно, чтобы весь документ был нажат на ссылку. Не только сам текст. Для ясности см. Изображение ниже, и вот живой код.

enter image description here.

У меня есть что-то вроде кода ниже. Я использую теги ссылок в сочетании с маршрутизацией приложения-маршрутизатора, которая отлично работает. Единственная проблема заключается в следующем: я хотел бы, чтобы весь документ-пункт меню был доступен клику с тегом ссылки.

Когда я использую приведенный ниже код, правая страница извлекается при непосредственном нажатии непосредственно на тег linkk, но это не создает "выбранное" состояние. Когда я нажимаю на кнопку (сразу после текста), тогда выбирается кнопка IS, но страница не извлекается, потому что я не нажимал ссылку...

Должен быть простой способ сделать это правильно? Я имею в виду, я мог бы заставить это переопределить все CSS, но мне кажется, что ссылка в бумажном элементе в бумажном меню будет очень распространенной вещью, которая должна делать это автоматически или с атрибутом или сопутствующим?

<paper-menu class="list">
  <paper-item icon="home" label="Home" ><a is="pushstate-anchor" href="/">Home</a></paper-item>
  <paper-item icon="polymer" label="Demo"><a is="pushstate-anchor" href="/demo">Demo</a></paper-item>
</paper-menu>

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

4b9b3361

Ответ 1

IMO, самый чистый способ - просто полностью удалить ссылки и просто добавить событие on-tap.

(Вы также можете использовать dom-repeat для своего меню)

<paper-menu class="list">
  <paper-item icon="home" label="Home" on-tap="menuSelected" mypath="/">Home</paper-item>
  <paper-item icon="polymer" label="Demo" on-tap="menuSelected" mypath="/demo">Demo</paper-item>
</paper-menu>

Я предполагаю, что вы используете теги <a> из-за app-router.

Из документа app-router:

go (путь, параметры). Вы можете вызвать маршрутизатор из Javascript для обеспечения императивного перехода.

Затем вы можете просто написать собственный обработчик на вкладке и использовать для каждого <paper-item>

пользовательский атрибут (mypath)
Polymer({
    is: 'your-menu',
    menuSelected: function (e) {
        var mypath = e.currentTarget.getAttribute('mypath'); 
        document.querySelector('app-router').go(mypath);
    },
})();

Ответ 2

Добавьте class="flex" к каждому из ваших якорных тегов.