Question

我正在尝试使用x-tag访问器，但我没有找到关于它们的良好文档。我想通过访问器传递一个函数并写下这样的东西：

<my-element logic="myFunction()"></my-element>

我想保存该功能并在以后使用它。有没有办法做到这一点？

Answer 1

我真的不确定你想要完成什么，但我会试一试。如果您尝试在所有<my-element>标记上提供某些逻辑，请使用methods对象，如下所示：

xtag.register('my-element', {
    methods: {
        logic: function (a) {
            return a * 2;
        }
    }
});

如果您希望能够单独为logic的每个实例分配<my-element>，那么您可以使用标准（非属性）访问器，并隐式执行此操作。

xtag.register('my-element', {
    accessors: {
        logic: {}
    }
});

HTML

<my-element id="test"></my-element>

为<my-element>

的一个实例设置逻辑

var el = document.querySelector('my-element#test');
el.logic = function (a) {
    return a * 2;
};

如果要使用属性将logic的值设置为全局函数，可以执行以下操作：

示例全局函数

function myFunction(a) {
    return a * 2;
}

组件

xtag.register('my-element', {
    accessors: {
        logic: {
            attribute: {},
            get: function () {
                return this._logic;
            },
            set: function (v) {
                this._logic = window[v] || null;
            }
        }
    }
});

用法（HTML）

<my-element logic="myFunction"></my-element>

用法（JS）

var el = document.querySelector('my-element');
el.logic(2); // 4

通过x-tag访问器传递函数

1 个答案: