vueダイナミックテーブルコミットパラメータダイナミック生成コントロールの実現

バックグラウンドデータに基づいて動的に生成するコントロールを作成し、ユーザーにクエリー情報を入力させ、動的に生成するテーブルを表示する必要があります.ダイナミックコントロールコードは次のとおりです.

    
              

                

                  
                    {{ item.cnname }}:
                    
                  
                  
                    {{ item.cnname }}:
                    
                  
                
                

                  
                    
                      {{ $t('table.search') }}
                    
                  
                
              
          

dataフォーマットは以下の通りです

  control: [{
        name: 'input1',
        cnname: '   1',
        type: 'input',
        value: '  '
      }, {
        name: 'time1',
        cnname: '    ',
        type: 'time',
        value: null
      }]

すべてのコントロールの変更を監視する

 computed: {
    //         
    formData: function() {
      var formData = {}
      this.control.forEach((item) => {
        formData[item.name] = item.value
      })
      return formData
    }
  }

ダイナミックテーブルは次のとおりです.

2つの配列が必要です.1つはテーブル列名を保存し、1つはテーブルデータを保存します.

 tables: [], 
      tableData: [dataItem: xxx,
          dataName: xxx], //