Question

我想知道是否可以将函数foo()作为属性func="foo()"传递，并在聚合物元素中调用this.func()？

<foo-bar func="foo()"></foo-bar>


Polymer({
  is: 'foo-bar',
  properties: {
    func: Object,
  },
  ready: function() {
    this.func();
  }
});

我一直试图让这个工作多年没有运气。

提前致谢。

Answer 1

<foo-bar func="foo()"></foo-bar>



Polymer({
  is: 'foo-bar',
  properties: {
    func: {
        type: String, // the function call is passed in as a string
        notify: true
  },
  attached: function() {
    if (this.func) {
        this.callFunc = new Function('return '+ this.func);
        this.callFunc(); // can now be called here or elsewhere in the Polymer object
  }
});

所以诀窍是＆＃34; foo（）＆＃34;首次将其传递给Polymer元素时是一个字符串。我和他一起战斗了一段时间，这是我能找到完成它的唯一方法。此解决方案创建一个函数，该函数返回您的函数调用，您将其指定为您的某个聚合物元素属性的值。

有些人可能会说你不应该使用Function构造函数，因为它类似于eval（）和......你知道，整个＆＃39; eval是邪恶的＆＃39;事情。但是，如果您只是使用它来返回对另一个函数的调用，并且您了解范围含义，那么我认为这可能是一个合适的用例。如果我错了，我确定有人会告诉我们！

这是一个很好的SO答案的链接，关于eval（）和Function构造函数之间的区别，以防它可以提供帮助：https://stackoverflow.com/a/4599946/2629361

最后，我把它放在＆＃39;附加＆＃39;生命周期事件是安全的，因为它发生的时间晚于“准备好”。我不确定是否有更早的生命周期事件或“准备好了”。可以用来代替＆＃39;附加＆＃39;也许有人可以改进这个答案，让我们知道。

将函数作为属性值传递

1 个答案: