Javascript 在VueJS after append（）元素中，单击方法不起作用

我可以在jquery中使用方法

$（document）解决这个问题如何在VUE解决相同的问题


newvue({
el:“#应用程序”，
数据：{
oldButton:函数（）{
$（'#app'）。追加（'新按钮'）；
},
newButton:函数（）{
log（'helloworld！'）；
},
},
});

旧按钮
在vue.js中，您通常不会在javascript中操作DOM；如果要有条件地显示组件，可以使用；您还应该将函数定义为
方法
，而不是
数据
：


newvue({
el:“#应用程序”，
数据：{
showNewButton:错误
},
方法：{
oldButton:函数（）{
this.showNewButton=true；
},
newButton:函数（）{
log（'helloworld！'）；
},
},
});

旧按钮
新按钮
如果您想要一组按钮：

const app = new Vue({

  el: '#app',

  data: {
    btns: []
  },

  methods: {
    addBtn() {
      this.btns.push({
         name: 'Dynamic Button'
      })
    },
    showMsg(index) {
      console.log('Hello World!, from Button ' + index)
   }
  }

})

以及：




{{btn.name}


添加按钮
看看希望它有帮助。非常感谢，这就是我的想法
<div id="app">    
  <ul>
     <li v-for="(btn, index) in btns">
        <button  @click="showMsg(index)" type="text"> {{ btn.name}}</button>             
     </li>
  </ul>    
<button @click="addBtn">Add Button</button>    
</div>