1. 用于"替换行的默认呈现"的插槽名称是item，而不是items
2. 将包装<tr>添加到插槽模板中
3. 只需将@click="onButtonClick(row.item)添加到v-btn，然后创建方法onButtonClick

    <v-data-table :headers="headers" :items="search_result">
      <template v-slot:item="row">
          <tr>
            <td>{{row.item.no}}</td>
            <td>{{row.item.result}}</td>
            <td>
                <v-btn class="mx-2" fab dark small color="pink" @click="onButtonClick(row.item)">
                    <v-icon dark>mdi-heart</v-icon>
                </v-btn>
            </td>
          </tr>
      </template>
    </v-data-table>

methods: {
    onButtonClick(item) {
      console.log('click on ' + item.no)
    }
  }

Note..

...上面的解决方案是用您自己的行渲染替换默认行渲染，所以希望v-data-table个功能中的一些功能可以升级到not work(我没有try ，但我希望行 Select 、分组、就地编辑等都会被 destruct ).如果这是你的问题，这里有一个替代解决方案:

1. 在标题定义中再添加一列:{ text: "", value: "controls", sortable: false }
2. 不要覆盖item插槽(行渲染).替代item.controls插槽.注意，"控件"与列定义中的相同——我们只覆盖"控件"列的呈现
3. 其他一切都一样

    <v-data-table :headers="headers" :items="search_result">
      <template v-slot:item.controls="props">
        <v-btn class="mx-2" fab dark small color="pink" @click="onButtonClick(props.item)">
          <v-icon dark>mdi-heart</v-icon>
        </v-btn>
      </template>
    </v-data-table>