Vue的filters传入多个参数的写法

最新推荐文章于 2024-08-23 09:13:49 发布

I'm Mr.C

最新推荐文章于 2024-08-23 09:13:49 发布

阅读量4.5k

点赞数 2

分类专栏： Vue.js 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/qq_44849271/article/details/122005425

版权

Vue.js 专栏收录该内容

30 篇文章 1 订阅

订阅专栏

Vue的filters传入多个参数的写法

Filters是Vue的过滤器

//传入一个参数时
<template>
    <div>
        <h1>{{content | filter}}</h1>
    </div>
</template>

<script>
export default {
    data(){
        return{
            content:""
        }
    },
    filters:{
        filter(text){
        	//text就是传过来的参数
            console.log("=>",text);
            return text;
        }
    }
}
</script>

<style scoped>

</style>

//传入两个参数时
<template>
    <div>
        <h1>{{content | filter(value)}}</h1>
    </div>
</template>

<script>
export default {
    data(){
        return{
            content:"内容1",
            value:"内容2"
        }
    },
    filters:{
        filter(text,text2){
        	//text就是传过来的第1个参数,text2就是传过来的第2个参数
            console.log("=>",text,text2);
            return text;
        }
    }
}
</script>

<style scoped>

</style>

//传入多个参数时
<template>
    <div>
        <h1>{{content | filter(value,value2,value3)}}</h1>
    </div>
</template>

<script>
export default {
    data(){
        return{
            content:"内容1",
            value:"内容2",
            value2:"内容3"
            value3:"内容4"
        }
    },
    filters:{
        filter(text,text2,text3,text4){
        	//text就是传过来的第1个参数,text2就是传过来的第2个参数,text3就是传过来的第3个参数,text4传过来的第4个参数
            console.log("=>",text,text2);
            return text;
        }
    }
}
</script>

<style scoped>

</style>