avue在2.7.x版本已经提供search.sync特性,绑定search参数后可以全局调用,无需通过传参的方式来获取。
之前老版本代码使用如下,通过 slot-scope 传入 row参数来获取
<avue-crud">
<template slot="search" slot-scope="{row,size}">
<el-button @click.stop="handleSearch(row)">测试</el-button>
</template>
</avue-crud>
handleSearch(row) {
console.log(row)
console.log(row.xxx)
}
经过3个月的过渡,avue升级到2.8.x后,推荐大家都改成如下API,这种方式更灵活,性能更高
export default {
data() {
return {
search:{},
}
}
<avue-crud :search.sync="search">
<template slot="search" slot-scope="{size}">
<el-button @click.stop="handleSearch()">测试</el-button>
<el-input placeholder="自定义输入框" :size="size" style="width:200px" v-model="search.slot"></el-input>
</template>
</avue-crud>
handleSearch() {
console.log(this.search)
console.log(this.search.xxx)
}
具体代码如下
扫一扫访问 Blade技术社区 移动端