vue.js无法触发事件是因为vue没有将其作为vue的模板解析渲染,其解决办法就是不用v-html,而是通过component模板编译渲染前端数据即可。
本教程操作环境:windows7系统、vue3版,DELL G3电脑。
vue.js v-html无法触发点击事件?
背景:
后端返前端html格式的数据,前端用v-html解析渲染,如:,a标签能成功渲染,但其绑定的事件无法触发。
立即学习“前端免费学习笔记(深入)”;
原因:
vue没有将其作为vue的模板解析渲染
解决方案:
不用v-html而是component模板编译
上干货:
<template> <div class="hello"> <h1> 我是父组件 </h1> <div class="parent" id="parent"> </div> </div> </template> <script> import Vue from 'vue'; var MyComponent = Vue.extend({ template: '<a @click="show(1)">我是大魔王</a>', methods: { show(i) { console.log(i); }, } }); var component = new MyComponent().$mount(); export default { data() { return { } }, methods: { }, mounted() { document.getElementById('parent').appendChild(component.$el); } } </script> <style scoped> </style>
页面:
控制台:
【相关文章推荐:vue.js】
以上就是vue.js无法触发事件怎么办的详细内容,更多请关注php中文网其它相关文章!
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号