1、代码为
<template>
<div>
<el-input v-model="name" @change="getByName" />
<br>
<el-button @click="getByName(name)">点击</el-button>
</div>
</template>
<script>
export default {
data() {
return {
tableData: [
{
date: "2016-05-02",
name: "王小虎",
address: "上海市普陀区金沙江路 1518 弄",
},
{
date: "2016-05-04",
name: "王小虎",
address: "上海市普陀区金沙江路 1517 弄",
},
{
date: "2016-05-01",
name: "王小虎",
address: "上海市普陀区金沙江路 1519 弄",
},
{
date: "2016-05-03",
name: "王小虎",
address: "上海市普陀区金沙江路 1516 弄",
},
],
search: "",
name:"小"
};
},
methods: {
handleEdit(index, row) {
console.log(index, row);
},
handleDelete(index, row) {
console.log(index, row);
},
getByName(name) {
console.log(name)
},
},
};
</script>
2、主要看向这两句
<el-button @click="getByName(name)">点击</el-button>
console.log(name)
这里的this为vue对象
第一句的name不能用,this.name不然反而报错
第二句的name,如果方法有传入参数name,则正常使用name,如果没有定义,使用name就Undefined,或者使用this.name直接也可以拿到数据