.

src/components/formList/formList.vue

@@ -15,14 +15,16 @@
             :key="index"
             style="margin:15px"
         >
-            <el-col :style="{width: lableWidth}" class="label">{{ lable[0] }}：</el-col>
-            <el-col :style="{width: inputWidth}">
-                <el-input v-model="value[lable[0]][index]"></el-input>
-            </el-col>
-            <el-col :style="{width: lableWidth}" class="label">{{ lable[1] }}：</el-col>
-            <el-col :style="{width: inputWidth}">
-                <el-input v-model="value[lable[1]][index]"></el-input>
-            </el-col>
+            <div v-for="(S_item, S_index) in title" :key="S_index">
+                <el-col
+                    :style="{width: titleWidth}"
+                    class="label"
+                >{{ title[S_index] || lable[S_index] }}：</el-col>
+                <el-col :style="{width: inputWidth}">
+                    <el-input v-model="value[lable[S_index]][index]"></el-input>
+                </el-col>
+            </div>
+
             <el-col :style="{width: '120px'}">
                 <el-button
                     v-show="listLength.length == index+1"
@@ -42,12 +44,19 @@
     </div>
 </template>
 
-
 <script>
 /* 
 v-model  数据结构 {key: Array, val: Array}  key 和 val 字段可自定义
-lableWidth lable的宽 统一设置 默认值100px
-inputWidth input的宽 统一设置 默认值200px
+titleWidth String lable的宽 统一设置 默认值100px
+inputWidth String input的宽 统一设置 默认值200px
+title Array 设置输入框的标题 不设置默认取 v-model 对象的key
+
+
+<formList v-model="data"></formList>
+data: {
+    时间: [1,2,33],
+    值: [1,2,3,4,5]
+},
 
 事件
 */
@@ -74,7 +83,13 @@ export default {
     },
     props: {
         value: undefined,
-        lableWidth: {
+        title: {
+            type: Array,
+            default() {
+                return Object.keys(this.value);
+            }
+        },
+        titleWidth: {
             type: String,
             default: "100px"
         },
@@ -84,6 +99,8 @@ export default {
         }
     },
     created() {},
+    mounted() {
+    },
     methods: {
         minus() {
             // 保证数组长度一致

src/components/formList/formList2.vue

@@ -0,0 +1,107 @@
+<template>
+    <div>
+        <el-button
+            v-show="value.length == 0"
+            @click="plus"
+            type="primary"
+            icon="el-icon-plus"
+            circle
+        ></el-button>
+        <el-row
+            type="flex"
+            :gutter="10"
+            align="middle"
+            v-for="(item, index) in value"
+            :key="index"
+            style="margin:15px"
+        >
+            <div v-for="(S_item, S_index) in title" :key="S_index">
+                <el-col :style="{width: titleWidth}" class="label">{{ title[S_index] || lable[S_index] }}：</el-col>
+                <el-col :style="{width: inputWidth}">
+                    <!-- <el-input v-model="value[lable[S_index]][index]"></el-input> -->
+                    <el-input v-model="value[index][lable[S_index]]"></el-input>
+                </el-col>
+            </div>
+
+            <el-col :style="{width: '120px'}">
+                <el-button
+                    v-show="value.length == index+1"
+                    @click="plus"
+                    type="primary"
+                    icon="el-icon-plus"
+                    circle
+                ></el-button>
+                <el-button
+                    v-show="value.length > 1 && value.length==index + 1"
+                    @click="minus"
+                    icon="el-icon-minus"
+                    circle
+                ></el-button>
+            </el-col>
+        </el-row>
+    </div>
+</template>
+
+<script>
+/* 
+v-model  数据结构 [{key: [], val: []}]  key 和 val 字段可自定义
+titleWidth String lable的宽 统一设置 默认值100px
+inputWidth String input的宽 统一设置 默认值200px
+title Array  设置输入框的标题 不设置默认取 v-model 对象的key
+
+
+<formList2 v-model="dataF" :title="['值','时间']"></formList2>
+dataF: [
+    {key:'a', value: 1},
+    {key:'a', value: 1},
+    {key:'a', value: 1},
+    {key:'a', value: 1}
+]
+
+事件
+*/
+export default {
+    name: "formList2",
+    data() {
+        return {};
+    },
+    computed: {
+        lable() {
+            return Object.keys(this.value[0]) || ["key", "value"];
+        },
+    },
+    props: {
+        value: undefined,
+        title: {
+            type: Array,
+            default() {
+                return Object.keys(this.value[0])
+            }
+        },
+        titleWidth: {
+            type: String,
+            default: "100px"
+        },
+        inputWidth: {
+            type: String,
+            default: "200px"
+        }
+    },
+    created() {},
+    methods: {
+        minus() {
+            this.value.pop();
+        },
+        plus() {
+            this.value.push({});
+        }
+    }
+};
+</script>
+
+<style lang="scss" scope>
+.label {
+    text-align: right;
+    color: #444;
+}
+</style>

src/views/fileInfo/test.vue

@@ -1,25 +1,39 @@
 <template>
     <div class="workerInfo">
-        <formList v-model="data"></formList>
+        <formList v-model="data">
+            <span>1</span>
+            <span>2</span>
+            <span>3</span>
+            <span>4</span>
+        </formList>
+        <!-- <formList2 v-model="dataF" :title="['值','时间']"></formList2> -->
+        <formList2 v-model="dataF"></formList2>
     </div>
 </template>
 
 <script>
 import formList from '@/components/formList/formList'
+import formList2 from '@/components/formList/formList2'
 
 export default {
     name: "test",
-    components: {formList},
+    components: {formList2, formList},
     data() {
         return {
             data: {
-                keys: [1,2,3,4,5],
-                vals: [1,2,3,4,5]
-            }
+                时间: [1,2,33],
+                值: [1,2,3,4,5]
+            },
+            dataF: [
+                {key:'a', value: 1},
+                {key:'a', value: 1},
+                {key:'a', value: 1},
+                {key:'a', value: 1}
+            ]
         };
     },
     created() {
-        
+        console.log(this.data)
     },
     methods: {