展开数据操作

请操作

<template>
    <div id="cart">
        <p>我是cart页面</p>
        <div v-for="(item,index) of listFilter" :key="index">
            <img class="item-img" :src="'/static/img/'+item.prodcutImg" alt="">
        </div>
        <button @click="expend">^</button>
    </div>
</template>

<script>
import axios from "axios"
export default {
    name:"Cart",
    data(){
        return{
            limit:3,
            list:[]
        }
    },  
    mounted(){
        this.getList()
    },
    computed:{
        listFilter(){
            return this.list.slice(0,this.limit)
        }
    },
    methods:{
        getList(){
            axios.get("../../static/goods.json").then(res=>{
                this.list=res.data.result
            })
        },
        expend(){
            if(this.limit==3){
                this.limit=this.list.length
            }else{
                this.limit=3;
            }
        }
    }
}
</script>

<style scoped>
.item-img{
    width: 300px;
    height: 100px;
}
</style>