<template> <v-app> <v-main> <v-btn class="error" @click="btnClick">测试</v-btn> <v-simple-table> <template v-slot:default> <thead> <tr> <th></th> <th> </th> <th></th> <th> ()</th> <th></th> <th></th> </tr> </thead> <tbody> <tr v-for="vert in verticies" :key="vert.name"> <td class="pa-4"> <div class="text-h6" :style="{color: $vuetify.theme.themes.light.primary}"> {{ vert.init ? 'S' : '' }}{{ vert.childrens.length == 0 ? 'F' : '' }} </div> </td> <td class="pa-4"> <v-text-field outlined label=" " v-model="vert.name" hide-details ></v-text-field> </td> <td class="pa-4"> <v-text-field outlined label="" v-model="vert.code" hide-details ></v-text-field> </td> <td class="pa-4"> <v-text-field outlined label="" suffix="" v-model="vert.duration" hide-details ></v-text-field> </td> <td class="pa-4"> <v-text-field outlined label="" suffix="." v-model="vert.price" hide-details ></v-text-field> </td> <td class="pa-4"> <v-btn icon color="error"> <v-icon> mdi-delete-outline</v-icon> </v-btn> </td> </tr> </tbody> </template> </v-simple-table> </v-main> </v-app></template><script>export default { name: "GraphDrawer", data: () => ({ verticies: [ {x: 1, y: 1, init: 'S', childrens: [{x: 1, y: 1}], name: '赵云', code: 101, duration: '长枪', price: 15}, {x: 1, y: 1, init: 'S', childrens: [{x: 1, y: 1}], name: '张飞', code: 102, duration: '蛇矛', price: 16}, {x: 1, y: 1, init: 'S', childrens: [{x: 1, y: 1}], name: '刘备', code: 103, duration: '双股剑', price: 17} ], result: [], }), mounted() { }, methods: { btnClick(){ console.log(this.verticies); } }}</script>更多建站及源码交易信息请见 GoodMai