• VUE字符串模板@click失效


    在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 }
  • 相关阅读:
    vue 中动画配置
    vue hash模式和404页面的配置
    vue 组件用法
    vue set方法
    vue 改变插值方法
    vue 接口统一管理
    Oracle同义词(Synonym)创建删除
    ASP.NET Core中间件实现分布式 Session
    plsql 导入导出表数据与表结构
    css3缩放 transform: scale() 使用缩放之后顶点对齐问题
  • 原文地址:https://www.cnblogs.com/ywy8/p/13535215.html
Copyright © 2020-2023  润新知