获取大量数据，怎么实现该数据的性能优化

获取的数据有些是非常庞大的，如果将该数据全部都设置成响应式的，也是对性能的一种损耗

在data中定义的数据都是响应式的，所谓的响应式就是vue帮我们监控对象的变化，只要变了就自动更新视图，所以是需要消耗性能的

如何实现性能优化

当获取大量的数据时，只要这时候从大数组中筛选出需要的小数组，让该小数组在data中定义（响应式），就是性能优化

例如：

 data(){
        return{
            // 在data中定义的数据都是响应式的
            // 所谓的响应式就是vue帮我们监控对象的变化，只要变了就自动更新视图，所以是需要消耗性能的
            // totalList:[],
            littleList:[]
        }
    },
    create(){
        this.get()
    },
    methods:{
        async getCateList(){
            const {message}=await uni.$u.http.get('https://goods/datas')
            // totalList没有在data中定义，所以它不是相应式的
            this.totalList=message
            // 从大数组中筛选出我们需要的小数组，就是性能优化了
            this.leftList=message.map(item=>({cat_id:item.id,cat_name:item.name}))
            console.log('totalList',this.totalList);
            console.log('littleList',this.littleList);
        }
    }

在此两个数组totalList和littleList,因为totalList没有在data中定义，所以totalList不是响应式的

通过打印我们会发现

响应的数据有 ob:Oserver

不是响应式的则没有