famo.us - 与 famo.us 合作的特性

Question

创建 InputSurface 时，我无法使用各种属性，例如 autofocus 或 maxLength。

this.email = new InputSurface({
        classes: ['login-form'],
        content: '',
        size: [300, 40],
        placeholder:'email',
        properties: {
            autofocus:'autofocus',
            maxLength:'5',
            textAlign: 'left'
        }
    });

呈现的 div 缺少我设置的属性。

<input class="famous-surface login-form" placeholder="email" type="text" name="" style="-webkit-transform-origin: 0% 0%; opacity: 0.999999; -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 614.5, 273.5, 0, 1); text-align: left; width: 300px; height: 40px;">

显然，电子邮件的 maxLength 为 5 是愚蠢的，但我只是想看看它是否可行，但我可以继续键入远远超过 5 的内容，并且在渲染表面时，它没有聚焦。有任何想法吗？我查看了示例/演示，但找不到使用这些属性或自动对焦的输入表面的示例/演示。

Answer 1

正如 dmvaldman 所建议的，这还不是一个特性，所以下面的 hack 将使它成为一个特性。

显然不是一个长期的解决方案，但我在 InputSurface.js 中添加了几行，属性现在被消耗了。

首先，我添加了分配 _attributes 的单行

function InputSurface(options) {
    this._placeholder = options.placeholder || '';
    this._value       = options.value || '';
    this._type        = options.type || 'text';
    this._name        = options.name || '';
    this._attributes = options.attributes || '';

    Surface.apply(this, arguments);
    this.on('click', this.focus.bind(this));
}

然后我添加了for循环消费部分进行部署。

InputSurface.prototype.deploy = function deploy(target) {
    if (this._placeholder !== '') target.placeholder = this._placeholder;
    target.value = this._value;
    target.type = this._type;
    target.name = this._name;

    for (var n in this._attributes) {
        target[n] = this._attributes[n];
    }
};

所以现在我可以执行以下操作:

    this.email = new InputSurface({
        classes: ['login-form'],
        content: '',
        size: [300, 40],
        placeholder:'email',
        attributes: {
            autofocus:'autofocus',
            maxLength:5
        }
    });

再一次，我意识到修改核心代码不是一个长期的解决方案，我现在只需要一些东西，直到有人有一个“官方”的答案，这对我有用。