Поместите вложенные значения ReactJS в GraphQL создать мутацию

Question

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

В моей нынешней реализации кажется, что она не может создавать какие-либо новые записи.Я хочу создать 1 «цель» с несколькими подчиненными «addr», привязанными к ней в одной мутации.

Это определения состояний:

state = {
    name:'',
    addr:[{
    mobilepkg:'',
    target_url:'',  
    target_ip: '',
    idCars:[]
    }],
    category:'',
    date: '',
    location:''
  }

Обработчик для графика:

   handleTarget = async e => {
        e.preventDefault()
        const { name,
        target_url,
        target_ip,category,
        mobilepkg,date,location } = this.state
        let idCars = this.state.idCars
        let adras = this.state.addr
        await this.props.createTargetMutation({
          variables: {
            data: {

          name,
        addr:{
        create:
        [{
          target_url,
          target_ip,
          mobilepkg,
         cars: {
                connect: idCars
              },

        }]
        },
        date,
        location,

              category
            }
          }
        })

        this.props.history.replace('/targets')
      }
    }

Моя мутация создания

const CREATE_DRAFT_MUTATION = gql`
 mutation CreateTargetMutation($data: TargetCreateInput!) {
    createTarget(data: $data) {
    id
    name
    addr
    category
    }
  }
`

Модель данных GraphQL

 type Target {
      id: ID! @unique
      name: String!
      addr: [Addr!]! 

      category: String!
      date:String!
      location:String!
    }

    type Addr {
      id: ID! @unique
      target_url:String!
      target_ip:String!
      mobilepkg:String!
      cars: [Car!]!
    }

Как поместить состояние ReactJS с вложенным массивом в GraphQL?PS: я новичок в GraphQL и ReactJS.

РЕДАКТИРОВАТЬ: На игровой площадке я могу создавать свои предметы, но это не работает в моем реальном приложении.

mutation CreateTargetMutation($data: TargetCreateInput!) {
    createTarget(data: $data) {
    id
    name
    addr{
        target_ip
        target_url
        mobilepkg
    cars{
     id
    }
    }
    category
    date
    location
    }
  }

{
  "data": {
    "name":"testerquery",
    "addr":  {
      "create": {
      "target_ip":"123",
        "target_url":"123",
        "mobilepkg":"asd",
    "cars":{"connect":{"id":"cjs3yd83u004a0781jffzaqqr"}}
    }
    },
    "category":"simple",
    "date":"2019-03-12",
    "location":"kl"
  }
}

Answer 1

Братан, ты один правильный путь.Вам просто нужно повторить ваши значения, чтобы решить эту проблему.Как только вы перебираете значения, вам просто нужно вызвать новый массив, который содержит все, и он будет работать.Поскольку ваши значения являются вложенными, вам нужно будет добавить «{}» в переменную вашего автомобиля и внутри нее, содержащей ваше соединение, поскольку вы хотите создать новый «адрес» при подключении к существующему «автомобилю».

 let create = []
        for(let i=0; i < this.state.addr.length; i++){
                create.push({
                    'mobilepkg':this.state.addr[i].mobilepkg,
                    'target_url':this.state.addr[i].target_url,
                    'target_ip':this.state.addr[i].target_ip,
                    'cars': {
                    'connect':  this.state.addr[i].cars}
                })
    }

      await this.props.createTargetMutation({
          variables: {
            data: {
         name,
         addr:  {
        create
        },
        category,
        date,
        location
            }
          }
        })
        this.props.history.replace('/targets')
      }
    }

Теперь ваши значения должны успешно перейти в GraphQL и создать цели с множеством «addr» при подключении ко многим «car»