在vue中使用字符串模板拼接的點擊事件@click時,點擊事件失效的處理辦法如下:
1、把@click改成onClick,如行3
1 var content = 2 `<div> 3 <div onClick="toDetail('${this.coordinate_info[i].id}')">${this.coordinate_info[i].enterprisename}<i title="查看詳情" class="el-icon-info showMore"></i></div> 4 <hr/> 5 <div>地址:${this.coordinate_info[i].address}</div> 6 <div>電話:${this.coordinate_info[i].telephone}</div> 7 <div>網址:<a href="http://${this.coordinate_info[i].website}" target="_blank" >${this.coordinate_info[i].website}<a/></div> 8 </div>`;
2、在生命周期created中賦值方法給window對象,如:
1 created() { 2 window.toDetail = this.toDetail;// 解決字符串模板@click無效的問題 3 },
3、方法可以正常調用了,可以在方法內打一個debugger測試下,如:
1 methods: { 2 toDetail(value){// 查看詳情 3 debugger 4 this.$router.push({ 5 path: `/orgmanage/enterpriseinfo/${value}`, 6 }); 7 } 8 }