Vue blur事件优先级高于click事件

今天写了一个select 框，用css focus 控制下拉框的展示。但是发现下拉框的列表不能点击，

原因：blur事件优先级高于click事件

解决方案：将 click 修改为 mousedown 

<div class="select-box"  >
  <p :key="1" @mousedown.stop="selectClick('职工教师')">职工教师</p>
  <p :key="2" @mousedown.stop="selectClick('学生')">学生</p>
  <p :key="3" @mousedown.stop="selectClick('社会人士')">社会人士</p>
</div>

mousedown 事件优先于blur事件