给按钮绑定个修改功能，用vue修改后端多行数据

可以使用axios库发送PUT请求来修改后端多行数据，具体代码如下：

<template>
<div>
<button @click="updateData">修改数据</button>
</div>
</template>

<script>
import axios from 'axios';

export default {
methods: {
async updateData() {
try {
const response = await axios.put('/api/data', {
// 在这里传入需要修改的数据
});
console.log(response.data);
} catch (error) {
console.error(error);
}
},
},
};
</script>

其中，/api/data是后端接口的地址，需要根据实际情况进行修改。在传入需要修改的数据时，可以使用Vue的v-model指令来绑定数据，例如：

<template>
<div>
<div v-for="(item, index) in dataList" :key="index">
<input v-model="item.name" />
<input v-model="item.age" />
</div>
<button @click="updateData">修改数据</button>
</div>
</template>

<script>
import axios from 'axios';

export default {
data() {
return {
dataList: [
{ name: '张三', age: 18 },
{ name: '李四', age: 20 },
{ name: '王五', age: 22 },
],
};
},
methods: {
async updateData() {
try {
const response = await axios.put('/api/data', this.dataList);
console.log(response.data);
} catch (error) {
console.error(error);
}
},
},
};
</script>

这样，当用户修改输入框中的数据后，点击按钮即可将修改后的数据发送给后端进行更新。