Обработчик события компонента реакции - не может получить доступ к событию

Question

Это основной вопрос JavaScript, но тем не менее отправил меня на поиски в Google. На основании this article приведенный ниже код должен работать, однако я получаю ошибку event.target is not a function в saveBubble. Когда я пробую event в отладчике, ошибка читается Uncaught: illegal access. arguments массив имеет необходимое событие, но почему он не работает, когда я звоню event?

export default class Bubble extends Component { 
    saveBubble(event) { 
    Bubbles.insert({ 
     text: event.target.attr('value') // <- throws an error here 
    }) 
    } 

    body() { 
    const { text } = this.props.bubble; 

    if (text) { 
     return text; 
    } 
    else { 
     return (
     <input type='text' onBlur={ this.saveBubble.bind(this) }/> 
    ) 
    } 
    } 

    render() { 
    return (
     <div className='bubble-wrapper'> 
     <div className='body'> 
      { this.body() } 
     </div> 
     </div> 
    ); 
    } 
} 

Answer 1

Я думаю, что вы, вероятно, хотите event.target.value вместо event.target.attr('value'). Это даст вам текущее значение во входном элементе, как описано в разделе react docs.

Я предполагаю, что вы действительно получаете event.target.attr is not a function в качестве сообщения об ошибке, так как элемент dom (например, event.target) не имеет этого метода, например, например, объект jquery.

Чтобы добавить немного больше ясности, я считаю, что это должно работать для вас:

saveBubble(event) { 
    Bubbles.insert({ 
    text: event.target.value 
    }) 
}