闲着没事,开发一个列表页面配置的功能,其中涉及到了按钮点击事件,在页面进行编辑,保存到数据库中。写好的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. 如何安装vue脚手架?

    前提(已经安装好node,可以正常使用npm) 一.cmd输入 npm install vue-cli -g ---- 全局安装vue-cli工具 安装好过后,再输入指令 vue --version ...

  2. 1.keras-构建基本简单网络实现线性回归

    构建基本简单网络实现线性回归 1.创建数据绘制散点图 import keras import numpy as np import matplotlib.pyplot as plt from kera ...

  3. 嵌入式Linux内核开发工程师必须掌握的三十道题

    如果你能正确回答以下问题并理解相关知识点原理,那么你就可以算得上是基本合格的Linux内核开发工程师. 1. Linux中主要有哪几种内核锁?(进程同步与互斥) (1)自旋锁:非睡眠锁 (2)信号量: ...

  4. Vue好书推荐

    1.Vue.js实战 从基础知识到ui组件封装和剖析,层层推进,最后两个案例实战.适合零基础入门,学完可就业.(推荐看这本) 交流地址(pdf原件):链接(点击跳转):提取码:7IsG 2.vue.j ...

  5. Maven 在Mac下的配置

    1.下载maven 解压到本地目录 官网下载Maven安装文件,如apache-maven-3.2.3-bin.tar.gz,然后解压到本地目录 解压: tar -zxcf apache-maven- ...

  6. [转载]win&office 激活教程,详细

    因为可能的版权&法律问题, 我也为了自我保全哈~ 不能直接转原文,详见官方文档 https://v0v.bid/kms.html https://v0v.bid 任何问题请联系作者 欢迎分享

  7. [CF453D]Little Pony and Elements of Harmony

    题目   点这里看题目. 分析   设\(count(x)\)为\(x\)的二进制中\(1\)的个数.因此\(f(u,v)=count(u\oplus v)\)   看一看每次转移,我们发现最不友好的 ...

  8. python中的bytes和str类型

    经过一上午的查找资料.大概理清楚了bytes类型和str类型的区别. bytes类型和str类型在呈现形式有相同之处,如果你print一个bytes类型的变量,会打印一个用b开头,用单引号括起来的序列 ...

  9. Linux环境下操作Oracle数据库命令

    A增量备份 在Oracle用户下进行: 1.su – oracle, pwd to make sure. 2.脚本位置more /home/oracle/arch.sh 3.运行脚本 ./arch.s ...

  10. 让apk可调试

    一定是这个  <application android:debuggable="true"   不是这个玩意, debugaable, 也不是debugable这个玩意