0

有人可以告诉我为什么我的代码不起作用??

我得到“this.username is undefined”,我真的不明白为什么......

这里的代码:

riot.tag2('test', '<input type="text" name="username" placeholder="username" oninput={validate} value="" /> <h4>{username_valid}</h4>', '', '', function(opts) {
    this.validate = function(e) {
        this.username_valid = (this.username.value.length > 3) ? 'Valid' : 'Invalid'
    };
});

谢谢你的帮助..

4

1 回答 1

3

仅仅因为它很难阅读,我希望你实际上并没有使用 riot API 编写组件。我将其转录成标签,以便我们更好地查看:

<test>

  <input
    type="text"
    name="username"
    placeholder="username"
    oninput={validate}
    value=""/>

  <h4>{username_valid}</h4>

  <script>

    this.validate = function(e) {
        this.username_valid = (this.username.value.length > 3) ? 'Valid' : 'Invalid'
    }

  </script>
</test>

您正在尝试从输入元素中获取用户名。this在标签中指的是脚本的范围,而不是 DOM 元素。有几种方法可以获得输入值

  1. 添加ref='username'<input>标签。
    然后用于this.refs.username.value从 ref 获取值

  2. validate函数中,用于e.target.value从oninput事件中获取元素

  3. 用于this.root.querySelectorAll('input')[0].value范围 DOM 查询

于 2017-03-24T20:24:53.877 回答