不知道是JS还是vue的问题

Question

我给下面的em元素绑定了一个click事件 第一次点击能触发 触发之后 通过innerHTML或者innertText改了内容 之后再点击这个元素就不能同志触发事件了 这是为什么呢

 获取验证码

getMessageCode(evt) {
let time = setInterval(() => {

      if (this.countDown <= 0) {
            clearInterval(time)
            this.countDown = 60
           //this.isSend = false
            evt.target.innerText = '重新发送验证码'
      }else {
              this.countDown --
              evt.target.innerText = this.countDown + '秒倒计时'
      }

}, 1000)
}

Answer 1

再点击这个元素的时候this.countDown已经小于0了，走 if (this.countDown <= 0) {时把点击的时候设置的interval给清了，当然没效果了

Answer 2

通过innerHTML或者innertText这里，把原来的em标签弄没了，或者是新的标签了，没click事件了

Answer 3

innerText 相当于重新渲染了，之前的都清除了，你需要重新绑定相关事件。或者将事件绑定到父级元素，在冒泡到你想要触发的子元素，你可以去看看jquery的 on 是如何给未来元素绑定事件的。

Answer 4

如果你用了vue，那就不应该，这样操作dom。正确的方式应该是 data{btnText:'发送验证码'}
<input type="button" v-model="this.btnText"/>。再倒计时候去改变 btnText的值。