为什么字符串模板渲染出来的button添加事件无效呢?

为什么字符串模板html可以渲染出来,加上点击事件就不可以了呢?
比如:
<button>按钮</button>
是可以渲染出来的,
<button @click="aa()"></button>
也能渲染出来,但是点击按钮无效,不能触发aa()事件,也没有报错,这是为什么呢?有懂其中的原理的吗?因为此按钮在表格里面,表格里面的内容都是通过数据动态渲染出来的,如果我想添加事件,正确的应该怎么添加呢?谢谢。

阅读 9.3k
4 个回答

是希望在运行时修改模板吗?需要使用 Vue.compile,参见:https://vuejs.org/v2/api/#Vue...。不过最好还是在开发的时候就写好模板啊,Vue 的模板很灵活,没必要在运行时变化的。

Vue 1 里之前有 partial,可以实现类似的功能,不过在 Vue 2 中已经 removed,同样参见 Vue 官方文档 https://vuejs.org/v2/guide/mi...

如果你是使用的是innerHTML赋值的话,事件点击无效,赋值的整个都是个字符串,改用addEventListener()等

我猜你是通过v-html来渲染字符串模板的,它不会作为 Vue 模板进行编译,所以@click无效,通过JavaScript方法绑定事件就OK了,如果需要@click,你需要通过vue组件来编译模板。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏