小编Vic*_*tor的帖子

我有一排包含隐藏内容的图块.我正在使用Magnific-Popup来获取内容并添加到灯箱,我似乎能够做到这一点,但我始终从所有内容中获取内容,而不是从点击的元素中获取内容.

我的问题是:我如何只获得点击元素中的内容？

HTML

<div class="tile">
   <div class="mfp-hide tile-info"><p>One</p></div>
</div>

<div class="tile">
    <div class="mfp-hide tile-info"><p>Two</p></div>
</div>

<div class="tile">
    <div class="mfp-hide tile-info"><p>Three</p></div>
</div>

<div class="tile">
    <div class="mfp-hide tile-info"><p>Four</p></div>
</div>

jQuery的

$('.tile').magnificPopup({
    items: {
    src: '.tile-info',
    },
    type: 'inline'
});

这是小提琴

http://jsfiddle.net/8csham4u/39/

在 Vue.js 中，你如何定位/检测被点击的元素来执行基本的切换类？

我写的这个可以成功切换但是当你点击一个a类被应用到所有li的

HTML

  <ul id="app" class="projects">
    <li v-bind:class="dyClass"><a href="" v-on:click.prevent.stop="show = !show">Project A</a></li>
    <li v-bind:class="dyClass"><a href="" v-on:click.prevent.stop="show = !show">Project B</a></li>
    <li v-bind:class="dyClass"><a href="" v-on:click.prevent.stop="show = !show">Project C</a></li>
    <li v-bind:class="dyClass"><a href="" v-on:click.prevent.stop="show = !show">Project D</a></li>   </ul>

JS

  new Vue({
    el: '#app',
    data: {
      show: false,
    },
    computed: {
      dyClass: function() {
        return {
          show: this.show
        }
      }
    }
  })

我是 Vue 的新手。

编辑。

我设法在下面的混合帮助下让它工作，但我似乎无法获得切换效果。

  <ul id="app" class="projects">
    <li :class="{show:selected == 1}">
      <a href="" @click.prevent.stop="selected = …

使用猫头鹰旋转木马我想使用图像alt="Image Alt Text"或title="Image Title Text"图像中的文本作为分页而不是子弹/圆圈.在写这个问题和小提琴的过程中,我怀疑它.见下文.希望这对其他人有用.

DEMO FIDDLE