如何在不重新渲染任何功能的情况下返回上一个屏幕进行导航

时间:2019-06-19 19:52:10

标签: reactjs react-native graphql apollo-client mutation

在这里单击按钮事件,我正在服务器中上传一些数据。我为此使用了变异。在响应之后,我必须导航到上一个屏幕,并且我不想刷新页面或重新呈现我要引导的屏幕的任何生命周期方法。 我已经使用过this.props.navigation.navigate(“ pagename”),但是通过使用此功能,有一些函数被调用。
所以我用过“ this.props.navigation.goBack()”,但还是一样。 向服务器提交请求后,我必须返回上一屏幕。

 import React, { Component } from 'react';
    import { View } from 'native-base';
    import {withApollo } from 'react-apollo';
    import gql from 'graphql-tag';
    import _ from 'lodash';
    import OverlaySpinner from '../ui/overlaySpinner';
    import AddNoteSection from '../../components/tabs/requestTab/AddNoteSection';
    import { handleErrors } from '../../services';


    class AddNoteSectionContainer extends Component {
        constructor(props) {
          super(props);
          this.state = {
            categoryList: [],
            isOpenClose: false,
            notes: "",
            notesResponse:[]
          };
        }

        addNoteChange = (event) => {
            this.setState({
              notes: event
            }, () => {
            });
          };

        statusTextModification = (currentstatus) => {
          var status ="";
         if (currentstatus === "Pending"){
           status = "P"
         }else if(currentstatus === "Close"){
          status = "C"
         }else{
          status = "A"
         }
         return status;
        } 

        OnButtonClick = async (data) => {
          var status = "";
          const{navigation}=this.props;
          const{workFlowDetails,troubleTicketDetails} =  
      navigation.state.params.ticketDetailsInfo;
          const workAgent_ID = workFlowDetails.currentNextActivity;

          const currentStepPosition = workAgent_ID.filter((item) => {
            return item._activityStatus === "I"
              });
           const workAgentID = currentStepPosition.map(currentStepPosition => {
            return currentStepPosition._workAgent;
               });
            let workAgent_id=workAgentID[0];
               console.log("Props for note  notes",workAgent_id);

              if (navigation.state.params.currentStatus === "Pending"){
                status = "P"
              }else if(navigation.state.params.currentStatus === "Close"){
               status = "C"
              }else{
               status = "A"
              }

          const mutationObj = `
            mutation createIncidentNote{
              createIncidentNote(
                input:{
                  status: "${status}",
                  incidentInitiator: "${data}",
                  notes: "${this.state.notes}",
                  userId: "${troubleTicketDetails.LoggedBy}",
                  workAgentID: "${workAgent_id}", 
                  referenceNumber: "${navigation.state.params.referenceNumber}",

                }){
                  REQUEST_STATUS
                  ABILLITY_REF_NUM
                  SUCCESS_MESG_LANG_1
                  SUCCESS_MESG_LANG_2
              }
            }
          `;
          try {
            const { data } = await this.props.client.mutate({
              mutation: gql(mutationObj)
            });
            // Here below is the code  I am using . 
            this.props.navigation.goBack()

          } catch (e) {
            handleErrors(e, this.props.navigation);
            console.log('Error in Adding note', e);
          }
        };

    render(){
       return(
          <View>
             <AddNoteSection
           {...this.props}
           addNoteChange={(text) => this.addNoteChange(text)}
           OnButtonClick={(data) => this.OnButtonClick(data)}
           />
             {/* {<OverlaySpinner color="#00678F" />}  */}
          </View>
       )
    }
    }
        export default withApollo(AddNoteSectionContainer);

0 个答案:

没有答案