Vue JS @ keyup.ecs在组件模板

Question

我使用twig模板引擎和vue js。我有模态和开放和关闭方法。打开方法，如果点击但关闭方法不起作用，然后按“esc”键。如果我在twig模板中使用@ keyup.esc =“closeModal”它的工作。但它不适用于我的组件模板。

  

在javascript中

 template : `
      <div class="row masonry-layout isotope_container">
        <div class="col-md-4 col-sm-6 isotope-item" v-for="item in materials">
          <div class="vertical-item content-padding topmargin_80">
            <div class="item-media">
              <img v-bind:src="item.image" alt="">
              <div class="media-links p-link">
                <div class="links-wrap">
                  <i class="flaticon-arrows-2"></i>
                </div>
                <a v-if="isNews" @click="openModal(item)" v-on:keyup.esc="closeModal()" class="abs-link"></a>
                <a v-if="!isNews" v-bind:href="item.image" class="abs-link"></a>
              </div>
            </div>
              ...

  

在树枝上

  <div id="cart" class="container">

    <cart
    v-bind:materials="news"
    type="news">
  </cart>

  <modal ></modal>
</div>

你能帮助我吗？