vue的v-show和@click的一個(gè)問題

組件中的一個(gè)模板如圖
初始ifShow為false 所以class='property' 的 ul 不顯示
通過focus事件觸發(fā)改變ifShow的值為true使class='property' 的 ul 顯示

問題

通過focus事件觸發(fā)顯示的ul click事件無效..
而如果在ifShow為false的情況下 手動(dòng)更改此時(shí)ul 的display屬性為block時(shí), ul顯示出來并且click事件有效

    template: `
    <div class='outside'>
        <ul class='input'>
            <li>
                <ul class='box'>
                    <li>
                        <div style='display:inline-block;overflow:hidden' v-if='tagsLength > 0'>
                            <span class='tag' v-for='(tag, index) in tags'>{{ tag.name }} <a href='#' @click='delTag(index)'>x</a></span>
                        </div>
                        <input :value='value' @input='$emit("input", $event.target.value)' @keyup.enter='onEnter' class='content' @focus='onFocus' @blur='onBlur'>
                    </li>
                    <li style='position:absolute;background:#fff;z-index:999'>
                        <ul class='property' v-show='ifShow'>
                            <li>{{ propertyHint }}</li>
                            <li v-for='property in properties' @click='onClick(property)' :data-id='property.id'>{{ property.name }}</li>
                        </ul>
                    </li>
                </ul>
            </li>
        </ul>
        <div class='help-tips'>
            <p>{{ inputHint }}</p>
        </div>
    </div>
`