右侧弹出栏窗口点击事件失效

[hellozxx]

按照demo中的customControlsExample.html和官方文档中的说明，在右侧弹出框中部分元素添加点击事件，但并未触发。

[muiplayer]

右侧弹出栏窗口点击事件失效

请尝试使用 div 做为包装控件的容器，示例：

<div slot="HD" style="display: none;">
    <div style="color: white;display: flex;flex-direction: column;align-items: center;justify-content: center;height: 100%;font-size: 16px;">
        <p onclick="on_hd(1)">Blu-ray 1080P</p>
        <p onclick="on_hd(2)">Ultra-clear</p>
        <p onclick="on_hd(3)">HD</p>
        <p onclick="on_hd(4)">SD</p>
    </div>
</div>

[hellozxx]

感谢作者的回复。改成div之后确实可以了。 但又有了另外一个问题：在vue中，即使改成div容器，仍然不可以触发点击事件，代码如下：

<div slot="HD" style="display: none;">
    <div class="playList">
      <p style="font-size: 16px;cursor: auto;"> 播放列表 </p>
      <p @click.native="changeSource()">001</p>
      <p @click="changeSource()">002</p>
      <p @click="changeSource">003</p>
      <p @click="changeSource">004</p>
      <p @click="changeSource">005</p>
      <p @click="changeSource">006</p>
    </div>
</div>

[hellozxx]

已解决。 在Vue的使用@click或者@click.native无法触发点击事件，需要使用原生的点击事件onclick。

方法如下哦： 1、更改绑定的点击事件

<p onclick="changeSource()">003</p>

2、在methods中定义相关方法

methods: {
    changeSource () {
        console.log('changeSource')
    }
}

3、在created中给window添加事件

created () {
    window.changeSource = this.changeSource
}

[aa2013]

这个弹出栏窗口为啥不显示，怎么触发，不是点击下右边空白处吗？