Redux状態の更新は、コンポーネントのステートレス関数内のメソッドに渡されません。

Question

Redux/Reactネイティブアプリケーションのコンポーネントを返すステートレス関数があります。

export default function TasksList (props) { 
    let ds = new ListView.DataSource({ 
    rowHasChanged: (r1, r2) => r1 !== r2 
    }); 

    const _onLongPress = (rowData) => { 
    props.changeCurrentlyEditedTask(rowData.index, rowData) 

    props.navigator.push({ 
     component: EditTask, 
     title: props.selectedTaskText, 
     leftButtonTitle: 'Cancel', 
     rightButtonTitle: 'Save', 
     onLeftButtonPress:() => _cancelEditingTask(), 
     onRightButtonPress:() => _saveEditedTask() 
    }) 
    } 

    const _cancelEditingTask =() => { 
    props.navigator.pop(); 
    props.resetSelectedTask(); 
    } 

    const _saveEditedTask =() => { 
    props.saveEditedTask() 
    props.navigator.pop(); 
    } 

    const dataSource = ds.cloneWithRows(props.listOfTasks); 

    return (
    <View style={ styles.tasksListContainer }> 
     <TextInput 
     autoCorrect={ false } 
     onChangeText={ (text) => props.onChangeText(text) } 
     onSubmitEditing={() => props.addTask(props.text) } 
     returnKeyType={ 'done' } 
     style={ styles.tasksListTextInput } 
     value={ props.text } /> 
     <ListView 
     automaticallyAdjustContentInsets={ false } 
     dataSource={ dataSource } 
     enableEmptySections={ true } 
     renderRow={ (rowData, secctionID, rowID) => { 
      return (
      <TasksListCell 
       completed={ rowData.completed } 
       id={ rowID } 
       onLongPress={ (rowID) => _onLongPress(rowData) } 
       onPress={ (rowID) => props.changeCompletionStatus(rowData.index) } 
       text={ rowData.text } 
       completed={ rowData.completed } 
       formattedDate={ rowData.hasOwnProperty('formattedDate') ? rowData.formattedDate : undefined } /> 
     ) 
     } 
     } 
     style={ styles.tasksListView } /> 
    </View> 
); 
}; 

私のRedux状態が変更されると、その変更は意図したとおりにTasksListに広がります。ただし、_saveEditedTaskはこれらの更新を受信できません。

propsをコンテナ内のsaveEditedTaskディスパッチメソッドの引数として渡そうとすると、親のTasksList関数が行う更新された状態は受信されません。

_saveEditedTaskが親のTasksList機能から最新のpropsを受信するようにこのコードを修正するにはどうすればよいですか？

Answer 1

現時点で_saveEditedTask関数が定義されており、実際にはTasksListコンポーネントの小道具にアクセスできます。

問題は、この関数をrenderメソッドの子オブジェクトの小道具として渡していないことです。

あなたのコンポーネントのレンダリングメソッドの子の1つに以下の小道具を付ける必要があります。これをしないと、関数は決して呼び出されません。

onSave={() => _saveEditedTask() }