v-for duplicating th of tr same code is working fine for other objects-CodePudding

I have seen few solutions online but It did not solve my problem. I am getting JSON object in the response.

        <!-- Show Negativita Check Azienda -->
        <table class="divide-y divide-gray-200 table-fixed w-full mt-4" v-if="showTableAzienda" v-for="item in impreses">
            <thead class="bg-gray-900">
            <tr>
                <th>Codice Fiscale</th>
                <th>Flag Domande</th>
                <th>Flag Pregiudizievoli</th>
                <th>Flag Procedure</th>
                <th>Flag Protesti</th>
                <th>Data Evasione</th>
            </tr>
            </thead>
            <tbody class="text-center py-6" >
            <tr>
                <td>{{item.codice_fiscale}}</td>
                <td>{{item.flagDomande}}</td>
                <td>{{item.flagPregiudizievoli}}</td>
                <td>{{item.flagProcedure}}</td>
                <td>{{item.flagProtesti}}</td>
                <td>{{item.dataEvasione}}</td>
            </tr>
            </tbody>
        </table>

Here is JSON response

{
  "codice_fiscale":"CLLLCA82R69D960T",
  "flagDomande":"N",
  "flagPregiudizievoli":"N",
  "flagProcedure":"N",
  "flagProtesti":"N",
  "dataEvasione":"2021-11-04"

}

because the elements in the object are six. it generates th for six times with no output. if I print {{impreses.codice_fiscale}} then it shows the output. I am not able to understand behavior.

EDIT Second Question

{"EventiNegativiPersona":
  {"InfoPersona":
    {"Nominativo":
      {"@attributes":{"cognome":"","nome":""}},
       "CodiceFiscale":"CLLLCA82R69D960T"},
       "ElencoProtesti":{"@attributes": 
       {"flagPresenza":"N"}},"ElencoPregiudizievoli":
       {"@attributes":{"flagPresenza":"N"}}}}

I would like to show these but {{[email protected]}} does not work because of @parameters. How can i show this?

CodePudding user response：

Based on the response object shown in your question you could move the v-for to the td tag :

      <table class="..." v-if="showTableAzienda" >
            <thead class="bg-gray-900">
            <tr>
                <th>Codice Fiscale</th>
                <th>Flag Domande</th>
                <th>Flag Pregiudizievoli</th>
                <th>Flag Procedure</th>
                <th>Flag Protesti</th>
                <th>Data Evasione</th>
            </tr>
            </thead>
            <tbody class="text-center py-6" >
            <tr>
                <td v-for="item in impreses">{{item}}</td>
            </tr>
            </tbody>
        </table>