Riot js undefined value

Question

Кто-то может сказать мне, почему мой код не работает, пожалуйста?

я получаю "this.username неопределен", и я не понимаю, почему ...

Вот код:

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' 
    }; 
}); 

Спасибо за вашу помощь ..

Answer 1

Просто потому что его так трудно читать, я надеюсь, что вы на самом деле не пишете компонент, используя 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, чтобы получить значение от исх

2. В функции validate используйте e.target.value, чтобы получить элемент из oninput события

3. Использования this.root.querySelectorAll('input')[0].value для контекстного DOM запроса