Javascript 带Vuejs和ElementUi的插槽筛选器

我有一个表，其中一列使用

插槽范围

，我无法将该列数据放入过滤器选项

代码

组件过滤器输入

<el-input v-model="filters[0].value" placeholder="Type to filter"></el-input>

组件脚本

我在filters函数中提供了更多的列示例，以便您能够理解

元素ui

表背后的逻辑

导出默认值{
道具：['user']，
名称：“adminOuterTransits”，
数据（）{
返回{
传输：[]，
过滤器：[
{
值：“”，
prop:['formNo'，//works（属于传输表）
“receiptNo”，//works（属于传输表）
'description'，//works（属于传输表）
‘fob’，//工程（属于运输表）
'gudang'，//works（属于传输表）
“ship_via”，//工作（属于运输表）
'sent_at'，//works（属于传输表）
'接收地点'，//工作（属于传输表）
'barcode']，//不起作用（它是关系数据“barcode.serial_number”）
}
]
}
},
//剩下的。。。。
}

---

知道如何将条形码数据包含到过滤器输入中吗？

也许下次最好在元素ui上提及扩展；）

但是为了回答您的问题，您必须编写自己的

filterFn

，因为

el表列上没有定义道具，所以道具是
未定义的

还可以查看提供的图表


如果不想使用
vue数据表
，也可以使用
计算的
数据集，如元素ui页面上的示例所示：
是否要根据呈现的文本对
条形码
列应用过滤器？而且我没有发现
el表提供一个道具=
filters
from。但是
el table column
提供了。@Sphinx您好，
您想根据呈现的文本为条形码列应用过滤器吗？
是<代码>我没有发现el表格提供了一个道具=过滤器
它在表格
：filters=“filters”
中。您是否介意将您的解决方案作为一个答案与我分享，这样我就可以知道我犯了什么错误？从@dreijintjens的答案中，我意识到您使用了扩展名
vue data table
，而不是Element-UI中的默认表组件
el table
。您好，谢谢您的答案，但我无法基于您的共享链接实现。您好，如果你能在codepen中设置一个样本，我会查看它。
<data-tables class="bg-white shadow-sm"
    :data="transits"
    :filters="filters"
    style="width: 100%">
    <el-table-column prop="name" label="Name" sortable="custom"></el-table-column>
    <el-table-column label="Barcode" sortable="custom"> <!-- can't get this data into filter -->
        <template slot-scope="scope">
            <div v-if="scope.row.barcode.serial_number">
                {{scope.row.barcode.serial_number}}
            </div>
            <template v-else>
                {{scope.row.barcode.u_serial_number}}
            </template>
        </template>
    </el-table-column>
</data-tables>

<script>
export default {
    props: ['user'],
    name: "adminOuterTransits",
    data() {
        return {
            transits: [],
            filters: [
                {
                    value: '',
                    prop: ['formNo', // works (belongs to transit table)
                            'receiptNo', // works (belongs to transit table)
                            'description', // works (belongs to transit table)
                            'fob', // works (belongs to transit table)
                            'gudang', // works (belongs to transit table)
                            'ship_via', // works (belongs to transit table)
                            'sent_at', // works (belongs to transit table)
                            'received_at', // works (belongs to transit table)
                            'barcode'], // DOESN'T WORK (IT'S RELATIONSHIP DATA "barcode.serial_number")
                }
            ]
        }
    },
    // rest of it....
}
</script>