Запустить одну мутацию с разными аргументами - PullRequest
Новая
       5

Запустить одну мутацию с разными аргументами

0 голосов
/ 12 марта 2020

В приведенном ниже компоненте пользователь может ввести результаты. Здесь каждый из результатов представляет собой отдельную строку таблицы «РЕЗУЛЬТАТ» в базе данных. У меня есть мутация, которая обновит индивидуальный результат. Здесь, когда пользователь нажимает кнопку сохранения, все результаты будут сохранены. Чтобы достичь этого, мутация UPDATE_RESULT должна вызываться с разными аргументами для каждого результата.

Может кто-нибудь подсказать мне, как это сделать?

Если у вас есть другой подход к реализации этой функции, пожалуйста, поделитесь им также.

Resolver 

const updateResult = async (_, {number, input: { entry, entered_by, status, old_status, result_modified, in_spec, cancelled, optional }}, {user, prisma}) => {
if(!user){
    throw new Error('Not Authenticated')
}
const updatedResult = await prisma.updateResult({
    data: {
        entry,
        entered_by,
        entered_on,
        status,
        old_status,
        result_modified,
        in_spec,
        cancelled,
        optional
    },
    where: {
        number
    }
})

return updatedResult
}

Компонент 

import React, { Suspense, useState, Fragment, useEffect } from 'react';
import ErrorBoundary from '../ErrorBoundary';
import { useMutation } from 'react-apollo';
import gql from 'graphql-tag'

const UPDATE_RESULT = gql`
mutation updateResult($number: Int!, $input: updateResultInput){
    updateResult(number: $number, input: $input){
     number
     name
}
}
`

export default function ResultDetails({results}){
   const [entry, setEntry] = useState({});
   const [inSpec, setInSpec] = useState({});

   const [mutation, { loading, error }] = useMutation(UPDATE_RESULT)


   const isInSpec = (val, max_val, min_val) => {
    if(val >= min_val && val<= max_val) return true;
    return false;
   }

   const saveResults = () => {
    for(let res in entry){
        console.log(entry[res], entry)
    }
    // run mutation 'update result' to save all the entered results
   }
   useEffect(() => {
        results.map(result => {
        let spec = isInSpec(parseInt(entry[result.name]), result.max_val, result.min_val);
        setInSpec({...inSpec, [result.name]: spec})
    })
}, [entry])
return (
    <Suspense>
        <ErrorBoundary>
            <Fragment>
            <table className="table">
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Type</th>
                        <th>Entry</th>
                        <th>Unit</th>
                        <th>In spec</th>
                    </tr>
                </thead>
                <tbody>
                    {console.log(results)}
                    {results.map(result => (
                        <tr key={result.number}>
                            <td>{result.name}</td>
                            <td>{result.result_type}</td>
                            <td>
                                <input
                                  style={{color: 'red'}}
                                  name={result.name} 
                                  type={result.type === 'numeric' ? "number" : "text"}
                                  value={entry[result.name] || ''}
                                  onChange={(e) => {
                                      setEntry({...entry, [result.name]: e.target.value})
                                    }}
                                />
                            </td>
                            <td>{result.unit}</td>
                            <td>{inSpec[result.name]? 'YES': 'NO'}</td>
                        </tr>
                    ))}
                </tbody>
            </table>
            <button onClick={saveResults}>Save</button>
            </Fragment>
        </ErrorBoundary>
    </Suspense>
)
}

1 Ответ

0 голосов
/ 12 марта 2020
  1. Ваша мутация GraphQL недействительна, вы объявили переменные, но не использовали их. Вы должны иметь что-то вроде этого: 
const UPDATE_RESULT_MUTATION = gql`
    mutation updateResultMutation($number: Int!, $input: updateResultInput){
        updateResult(number: $number, input: $input) {
            number
            name  
        }
    }
`
Чтобы выполнить мутацию с некоторыми переменными, вы должны использовать этот синтаксис: 
          mutation({ variables: {
                number: 1, 
                input: 
                  {
                     inputField: "inputValue",
                     //... more fields from your state
                  } 
          });

Я бы предложил переименовать переменные во что-то более значимое - например, mutation -> executeUpdateMutation

...