2015-02-18 5 views
0

Обычно в React.js, если я вызываю this.setState({data: newData}), this.state.data установлен в newData, и весь компонент визуализируется снова.React.js: Не удалось установитьState

В моем коде у меня есть панель поиска. Когда я нажимаю enter, я хочу установить search_term в введенное ключевое слово.

if (evt.keyCode == 13) { 
    this.setState({search_term: keyword}) 
} 

Ключевое слово «собака», а evt.keyCode - 13 непосредственно перед этим (я распечатал его). Я достигаю вызова setState. Тем не менее, я получаю сообщение об ошибке:

Uncaught TypeError: Can't add property framesToPop, object is not extensible. 

Это вызывает вызов SetState на провал, и, таким образом, не установлено состояния компонента или повторной визуализации компоненты, чтобы показать новый термин поиска на странице (предполагая, что я распечатываю search_term внутри моей функции рендеринга).

Любые идеи по отладке? Что может произойти? Я могу предоставить дополнительную информацию, если это необходимо, просто дайте мне знать! :)

[Редактировать]

Это код консоли приносит мне для framesToPop

/** 
* Use invariant() to assert state which your program assumes to be true. 
* 
* Provide sprintf-style format (only %s is supported) and arguments 
* to provide information about what broke and what you were 
* expecting. 
* 
* The invariant message will be stripped in production, but the invariant 
* will remain to ensure logic does not differ in production. 
*/ 

var invariant = function(condition, format, a, b, c, d, e, f) { 
    if ("production" !== "development") { 
    if (format === undefined) { 
     throw new Error('invariant requires an error message argument'); 
    } 
    } 

if (!condition) { 
    var error; 
    if (format === undefined) { 
     error = new Error(
     'Minified exception occurred; use the non-minified dev environment ' + 
     'for the full error message and additional helpful warnings.' 
    ); 
    } else { 
     var args = [a, b, c, d, e, f]; 
     var argIndex = 0; 
     error = new Error(
     'Invariant Violation: ' + 
     format.replace(/%s/g, function() { return args[argIndex++]; }) 
    ); 
    } 

    error.framesToPop = 1; // we don't care about invariant's own frame 
    throw error; 
    } 
}; 
+5

Я думаю, вам нужно добавить еще несколько контекстов кода, например, что такое 'frameToPop'? –

+0

Согласен, требуется немного больше контекста. Как и другие вызовы' setState' вы создаете? Ошибка 'object is extensible' вызывается, когда объект Object.preventExtensions (obj)' вызывается на объект, и затем вы пытаетесь добавить к нему свойства. –

+0

@limelights 'framesToPop' исходит от response.js код. Не мой.Я добавил код, который он приносит мне в ошибке. – stogers

ответ

0

Я не уверен, что я дал достаточно контекст, так что я извиняюсь за это. Как-то мой вызов setState вызывал ошибку framesToPop, несмотря на то, что один раз вызывал только setState. Как я уже сказал, я показывал состояние, используя div в функции рендеринга.

<div class='search-display'> {this.state.search_term} </div> 

Я звонил в некоторые jquery, чтобы редактировать html, который показывал поисковый запрос на веб-сайте.

$(.search-display).modifyDiv() 

Я установил его, установив условие search_term в нуль первым.

this.setState({search_term: null}, function() { 
    this.updateSearchTerm(evt, keyword) 
}) 

Где this.updateSearchTerm код, который делает this.setState({search_term, keyword}). Не знаю, почему это сработало, хотя :(

+2

Замечание, но вам не нужно использовать jQuery для обновления DOM, это то, на что реагируют в первую очередь –

+0

Я согласен с @DanaWoodman - вам не нужно использовать JQuery, чтобы жизненный цикл реагирования был обновлен компонент при обновлении состояния. – Narutkowski

Смежные вопросы