在vue js中使用数组列表预先输入

Question

这是我的代码，现在我可以在 typeahead 字段中显示所有结果。但是缺少一些数据。如何将所有数据映射到一个数组中？

data() {
    return {
        list: [],
    }
}

axios.get('list', {})
.then(function (response) {
    self.list = response.data.map(x => x.name1);
})
.catch((error) => {
    console.log(error);
});

//Api return josn
[
{
    "id": 17,
    "name1": "Apple",
    "name2": "Apple2"
},
{
    "id": 237,
    "name1": "Orange",
    "name2": "Orange2"
}
]

现在，我的数组是 ['Apple','Oragne'] 但我想要我的数组 = ['Apple','Apple2','Orange','Orange2']

Answer 1

有很多方法。你可以使用reduce来累积你想要的数组。

另外，您的回复没有data 字段。

代替：

self.list = response.data.map(x => x.name1);

用途：

self.list = response.reduce((acc, item) => {
    acc.push(item.name1);
    acc.push(item.name2);
    return acc;
}, []);

https://jsfiddle.net/jmbldwn/h6v3mo9f/4/