<ListX :areaData="areaDataNotLevel"></ListX>
<script>
import ImageView from './ImageView.vue'
import List from './list.vue'
import ListX from './list2.vue'
import { areaData } from '../data'
export default {
components: { ImageView, List, ListX },
name: 'HelloWorld',
created() {
this.areaDataNotLevel = [
{ code: '', levelx: 0, name: '全部' },
...this.initData(areaData, 0)
]
},
data() {
return {
areaDataNotLevel: []
}
},
methods: {
initData(data, index) {
data.forEach((item) => {
item.levelx = index
if (item && item.areaList) {
this.initData(item.areaList, index + 1)
}
})
return data
}
}
}
</script>
<style scoped>
h1,
h2 {
font-weight: normal;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
.hello {
display: flex;
align-items: center;
margin-left: auto;
}
.hello > div {
margin-left: 20px;
}
</style>