使用vue3写一段三级联动商品分类组建的代码

<script>
const categories = [
{
name: '手机',
children: [
{
name: '华为',
children: [
{
name: 'Mate20'
},
{
name: 'P30'
}
]
},
{
name: 'iPhone',
children: [
{
name: 'iPhone Xs'
},
{
name: 'iPhone 11'
}
]
}
]
},
{
name: '电脑',
children: [
{
name: '联想',
children: [
{
name: '小新'
},
{
name: 'Yoga'
}
]
},
{
name: 'Apple',
children: [
{
name: 'Macbook Pro'
},
{
name: 'Macbook Air'
}
]
}
]
}
] new Vue({
el: '#app',
data: {
categories: categories,
currentLevel: 0,
currentCategory: [],
result: ''
},
methods: {
changeCategory (level, category) {
this.currentLevel = level
this.currentCategory = category
},
selectCategory (category) {
this.result = category.name
}
}
})
</script>