Добавление клиентской мутации Apollo в реагирующий загрузчик данных - PullRequest
Новая
       9

Добавление клиентской мутации Apollo в реагирующий загрузчик данных

0 голосов
/ 29 августа 2018

Я могу получить компонент запроса Apollo в моем приложении. Но мне трудно добавить мутацию. У меня выписан запрос на мутацию. Я хочу использовать строку и значение ячейки из функции хука cellEditProp и передать их в компонент мутации. Мне трудно понять, где вложить или обернуть компонент мутации. Любые советы очень ценятся. 

function onSaveCell(row, cellName, cellValue) {

    //Need to use this data for the mutation
}

function onBeforeSaveCell(row, cellName, cellValue) {
    console.log(cellName, cellValue, row

    );
    return true;
}

const cellEditProp = {
    mode: 'click',
    blurToSave: true,
    beforeSaveCell: onBeforeSaveCell, // a hook for before saving cell
    afterSaveCell: onSaveCell  // a hook for after saving cell
};


const APPROVALCHAIN_QUERY = gql`
    {
      vApprovalChainApproverCountList{
        applicationId
        applicationName
        collectionName
        licenseType
        cost
        approvers

      }
    }
    `;
const ADDCOST_MUTATION = gql`
  mutation updateCostlicense($costLicense: ApplicaitonCostInput!){
  updateCostLicense(costLicense: $costLicense){
    applicationId
    cost
    licenseType
  }
}
`;



class ApprovalRecord2 extends Component {

    render() {
        return (
            <Query
                query={APPROVALCHAIN_QUERY}
            >
                {({ loading, error, data }) => {
                    if (loading)
                        return <p>Loading...</p>;

                    if (error)
                        return <p>{error.message}</p>;

                    const chain = JSON.parse(JSON.stringify(data.vApprovalChainApproverCountList));
                    console.log(chain);

                    return (
                        <div>
                            <h1>ApprovalRecord2</h1>
                            <p>Add/Remove Approvers</p>

                                    <BootstrapTable data={chain} striped hover pagination search options={options} cellEdit={cellEditProp} version='4'>
                                        <TableHeaderColumn isKey dataField='applicationId' dataSort={true}>ID</TableHeaderColumn>
                                        <TableHeaderColumn dataField='applicationName' dataSort={true}>Application</TableHeaderColumn>
                                        <TableHeaderColumn dataField='collectionName' dataSort={true}>Collection</TableHeaderColumn>
                                        <TableHeaderColumn dataField='licenseType' dataSort={true}>License</TableHeaderColumn>
                                        <TableHeaderColumn dataField='cost' dataSort={true}>Cost</TableHeaderColumn>
                                        <TableHeaderColumn dataField='approvers' dataSort={true}>Approvers</TableHeaderColumn>

                                    </BootstrapTable>

                                )}
                        </div>
                    );
                }}
            </Query>
        );
    }
}
export default ApprovalRecord2;

1 Ответ

0 голосов
/ 01 сентября 2018

Вы можете передавать / вводить (множественные, именованные) мутации (и запросы) как реквизиты для компонента с помощью graphql ()

...