Getting Mapbox GL addlayer 'in' filter to work when match target is comma separated list?

Question

How do I get Mapbox GL addlayer 'in' filter to work when the match target is a comma separated list? i.e. v10 will work v7 doesn't

    var layers = [
        ["v1",  '#723122', "1,2,3,4,5,6,7,8,9"],                //- Artificial Surfaces
        ["v2",  '#8B4225', "10,11,12,13,14,15,16"],             //- Bare or lightly vegetated
        ["v3",  '#B4FFFF', "20,21,22"],                         //- Water bodies
        ["v4",  '#DBB052', "41,42,43,44"],                      //- Tussock
        ["v5",  '#F0D54E', "'30','31','32'"],                         //- Cropland
        ["v6",  '#ABCD66', "40"],                               //- Grassland
        ["v7",  '#508474', "45,46,47,48,49,70"],                //- Wetland
        ["v8",  '#8C7922', "50"],                               //- Fernland
        ["v9",  '#C4BB89', "51"],                               //- Gorse or Broom
        ["v10", '#89CD66', "52"],                               //- Manuka Kanuka
        ["v11", '#8C7922', "54"],                               //- Indigenous Hardwood
        ["v12", '#8C7922', "55"],                               //- Sub Alpine
        ["v13", '#C4BB89', "56,59,60,61,62,63,64,65,66,67,68"], //- Mixed Exotic
        ["v14", '#8C7922', "58"],                               //- Matagouri  Grey Scrub
        ["v15", '#75923C', "69"],                               //- Indigenoues Forest
        ["v16", '#4F6228', "71"]                                //- Exotic Forest
    ];

    $.ajax({
        type    : 'GET',
        url     : "http://" + location.host + '/json/vegetation/' + northWest[1] + '/' +southEast[1]+ '/' +southEast[0]+ '/' +northWest[0] + '/',
        dataType: 'json',
        success : function(jsn){

            if(!map.getSource('lris_vegetation')) {
                map.addSource('lris_vegetation', {
                    'type': 'geojson',
                    'data': jsn
                });
            }

            $.each(layers, function(idx,layer){

                var layerId = layer[0];

                console.log("layerId: " + layerId + " : " + layer[0] + " : " + layer[1] + " classes: ", layer[2]);

                if(!map.getLayer(layerId)) {
                    map.addLayer({
                        'id'    : layerId,
                        'type'  : 'fill',
                        'source': 'lris_vegetation',
                        'layout': {
                            'visibility'    : 'none'
                        },
                        'paint': {
                            'fill-color'        : layer[1],
                            'fill-opacity'      : 0.4,
                            'fill-outline-color': "#000"
                        },
                        "filter": ["in", "Class_2012", layer[2]]
                    });
                }
            });

        },
        error   : function(e){
            console.log(e.responseText);
        },
        beforeSend:function(){
            $('.loader').show();
        }
    })
    .always(function () {
        $('.loader').hide();
        $('#vegetation-legend').show();
    });

Answer 1

According to the docs, 'filter' needs to be a flat array:

This filter requires that the class property of each feature is equal to either "street_major", "street_minor", or "street_limited".

["in", "class", "street_major", "street_minor", "street_limited"]

So instead of:

"filter": ["in", "Class_2012", layer[2]]

How about:

"filter": ['in', 'Class_2012'].concat(layer[2].split(','))

Using this example:

["v13", '#C4BB89', "56,59,60,61,62,63,64,65,66,67,68"]

Your filter will be:

["in", "Class_2012", "56", "59", "60", "61", "62", "63", "64", "65", "66", "67", "68"]