Я встретил неожиданную проблему и не могу решить ее второй день, поэтому я обращаюсь за помощью здесь. Кроме того, я должен упомянуть, что я использую CoffeeScript 2.
У меня есть родительский компонент ( Форма ) и дочерние компоненты (элементы формы), проблема касается одного из компонентов (пользовательский нескольковыбор опций). Их порядок работы следующий: в форме есть этот компонент, у которого установлен реквизит значение (массив объектов, полученных из формы this.state, изначально этот массив пуст) и enterChange (обработчик, который изменяет состояние, т.е. выбранные параметры).
Дочерний элемент ( FormItem ), также имеет свою собственную логику, имеет два состояния - режим просмотра выбранных параметров и режим выбора. Каждый раз, когда вы нажимаете на опцию в режиме выбора, вызывается эта функция (которая заставляет родителя обновлять данные):
select: (option) =>
if @props.config.multiple
selected_options = @props.value
already_exists = _.findWhere selected_options, { id: option.id }
if already_exists
options = _.reject selected_options, (object) -> object.id is option.id
else
options = [selected_options..., option]
@props.enterChange options // here we pass an array of selected options.
else
@props.enterChange option
@hideSelector()
А вот обработчик enterChange вparent ( Form ):
selectActiveOptions: (options) =>
# ask you to pay attention to this console.log
console.log options # prints [undefined]
@setState
current_page: {
@state.current_page...
active_options: {
@state.current_page.active_options...
value: options
valid: null
}
}
А теперь вот что я получаю и что меня действительно удивляет: Состояние ( this.state.current_page.active_options.value , которое я использую в качестве значение реквизит для FormItem ) превращается в массив неопределенных, например, если я выбираю три варианта, то я получаю [undefined, undefined, undefined] . Но это еще не все ...
Как вы видели, console.log печатает тот же массив неопределенных, НО! Если я отключу функцию this.setState, то переменная options - это обычный массив объектов! Здесь:
selectActiveOptions: (options) =>
# ask you to pay attention to this console.log
console.log options # prints [{ id: 'first', title: 'First' }]
# @setState
# current_page: {
# @state.current_page...
# active_options: {
# @state.current_page.active_options...
# value: options
# valid: null
# }
# }
Кроме того, если я не использую состояние значение в качестве реквизита FormItem , то состояние будет успешно изменено (получен массив объектов)! Я вообще не понимаю, в чем дело, поэтому я прошу вашей помощи мне в этой странной для меня проблеме .....