name of object within payload javascript

I have this payload.

{name: "Sinto 6", val: {…}, line: "Sinto 6"}
line: "Sinto 6"
name: "Sinto 6"
val:
AvgMachTime: 253
AvgManTime: 1343
CollectMachTimer: 359
CollectManTimer: 108
CycleTimeMach: 359
CycleTimeMan: 140
FaultTime: 15297
MachTargetSeconds: 330
ManTargetSeconds: 95
NGPartCount: 63
OnHeatTime: 11201
PartCount: 12
PartTarget: 78

I’m trying to use Vue to set the values in the state using

const PERFORMANCE_COMMIT = (state, payload) => {
Vue.set(state["Performance"][payload.line], [payload.val], payload.val);
}

I realise one of my payload.val need to be the name of the value and not the name itself.

How can I reference this correctly?

My state looks like this:

Performance: {
    TotalPartTarget: 0,
    TotalPartCount: 0,
    Difference: 0,
    OEE: 0,
    OEETarget: 100,
    "Sinto 6" :{
      PartTarget: 0,
      PartCount: 0,
      NGPartCount: 0,
      OEE: 0,
      FaultTime: 0,
      OnHeatTime: 0,
      CycleTimeMan: 0,
      CycleTimeMach: 0,
      CollectManTimer: 0,
      CollectMachTimer: 0,
      AvgManTime: 0,
      AvgMachTime: 0,
      ManTargetSeconds: 0,
      MachTargetSeconds: 0

Edit: Spelling

Answer

As per the Vue documentation (Vue.set Documentation Link), first parameter is target, second is property name / index and third is the value.

So, in you case target property is state[“Performance”], property name is payload.line (“Sinto 6”) and value is payload.val.

const PERFORMANCE_COMMIT = (state, payload) => {
  Vue.set(state["Performance"], payload.line, payload.val);
}