闲着没事,开发一个列表页面配置的功能,其中涉及到了按钮点击事件,在页面进行编辑,保存到数据库中。写好的js脚本,function是字符串格式,所以要让生成的脚本生效,还要做一些操作。

1.首先保存在数据库中的是字符串格式,如下:

可以看出这个只是一个字符串,如何让这个字符串转成对象,以及字符串的方法转成可执行的方法?

2.用Function()将字符串转成方法,具体如下

var that = this ;
var funcTest = (new Function('return '+events))() ;

可以看出,上面的字符串已经变成了可以使用的function,但是还存载问题

3.当点击事件中用到当前域时,会报错,具体如下: 

其中that 指代的时父域this,会发现,that是undefined,这就存在了问题,父页面的数据在子组件中无法调用了;

4.通过当前子组件域绑定到父的域中,就可以实现,具体如下:

查看相关的this绑定的方法,如下:

https://blog.csdn.net/q3254421/article/details/86074284

https://blog.csdn.net/sllailcp/article/details/90754463?depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromBaidu-1&utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromBaidu-1

call()和apply()方法进行this绑定;

js 字符串转方法,this域绑定的更多相关文章

  1. 浅谈 js 字符串 trim 方法之正则篇

    原文:浅谈 js 字符串 trim 方法之正则篇 关于 trim 其实没啥好说的,无非就是去除首位空格,对于现代浏览器来说只是简单的正则 /^\s+|\s+$/ 就可以搞定了.而且支持中文空格   等 ...

  2. 浅谈 js 字符串 search 方法

    原文:浅谈 js 字符串 search 方法 这是一个很久以前的事情了,好像是安心兄弟在学习js的时候做的练习.具体记不清了,今天就来简单分析下 search 究竟是什么用的. 从字面意思理解,一个是 ...

  3. JS字符串处理方法

    1.字符方法charAt()和charCodeAt();这两个方法都接收一个参数例:<script>var stringValue = "hello world"; s ...

  4. js字符串排序方法

    前端开发过程中有时需自己手写排序方法 一般想到数字的字符串排序方法 我们会用到 var newArr = arr. sort(function(a,b){return a - b})来进行排序 但除此 ...

  5. js 字符串格式化方法

    String.prototype.format = function(args) { var result = this; if (arguments.length > 0) { if (arg ...

  6. 浅谈 js字符串 trim 方法之正则篇

    关于 trim 其实没啥好说的,无非就是去除首位空格,对于现代浏览器来说只是简单的正则 /^\s+|\s+$/ 就可以搞定了.而且支持中文空格   等等.什么 \s 支持 中文空格?是的. 打开 Re ...

  7. js 字符串 处理方法

    charAt() 返回指定索引位置的字符 charCodeAt() 返回指定索引位置字符的 Unicode 值 concat() 连接两个或多个字符串,返回连接后的字符串 fromCharCode() ...

  8. js字符串RTrim方法(right trim)

    String.prototype.RTrim = function (c) { if (!c) { c = ' '; } var reg = new RegExp('([' + c + ']*$)', ...

  9. C#中在AxWebBrowser控件注入JS脚本的方法

    /// <summary> /// 窗体加载 /// </summary> private void JS_Load(object sender, EventArgs e) { ...

随机推荐

  1. Java实现 黑洞数

    任意一个5位数,比如:34256,把它的各位数字打乱,重新排列,可以得到一个最大的数:65432,一个最小的数23456.求这两个数字的差,得:41976,把这个数字再次重复上述过程(如果不足5位,则 ...

  2. 关于64位W7下怎么学习汇编语言的一些心得!

    出处:http://tieba.baidu.com/p/2277546332 1.首先下载DOSBOX,它的作用就是让你在64位下使用32.16位的软件.如果不使用DOSBOX就会出现程序不兼容的对话 ...

  3. harbor私有仓库安装

    准备环境 centos7.4 docker-ce 19.03.8 docker-compose version 1.18.0 harbor 版本: 1.7.5   一.安装dokcer # 安装依赖包 ...

  4. MongoDB知识点总结

    一:MongoDB 概述    一.NoSQL 简介 1. 概念:NoSQL(Not Only SQL的缩写),指的是非关系型数据库,是对不同于传统的关系型数据库的数据库管理系统的统称.用于超大规模数 ...

  5. Java规则引擎 Easy Rules

    1.  Easy Rules 概述 Easy Rules是一个Java规则引擎,灵感来自一篇名为<Should I use a Rules Engine?>的文章 规则引擎就是提供一种可选 ...

  6. el-table 表格加图片、加音频、加序号、多级动态表头

    elemnet-ui组件库大家应该不陌生,在展示多条结构类似的数据方面,el-table可谓扛把子,不仅可以把数据展示的整齐,还支持排序.筛选或其他自定义操作.那么,除了上述的基本功能外,你还遇到过哪 ...

  7. vue甘特图gantt

    vue做甘特图,先大致介绍下核心功能: (1)横轴.纵轴拖拽: (2)自定义监听点击事件(双击.右键等)(3)任务之间显示父子层级关系:(4)左侧列表信息,右侧时间轴表示任务:(5)每个任务可以订制样 ...

  8. 大厂面试过程复盘(微信/阿里/头条均拿offer,附答案篇)

    背景 本人前端,3年经验,由于个人的原因,决定跳槽,于是大概3月开始找工作,总历时大概2个月,面试了微信/阿里/头条,三家都拿到了offer,来分享一下面经. 问题比较多,而且很多面试题都是跟个人项目 ...

  9. git添加所有新文件

    git add -A 提交所有变化 git add -u 提交被修改(modified)和被删除(deleted)文件,不包括新文件(new) git add . 提交新文件(new)和被修改(mod ...

  10. BUAA_OO_2020_Unit2_总结博客

    BUAA_OO_2020_Unit2_总结 2020年春季学期第八周,OO第二单元落下帷幕,三次多线程任务作罢,萌新在OO的世界里又迈出了艰难但有意义的一步,下作总结: 一.三次作业设计策略 回顾三次 ...