Home TAB bar switch want effect is: loaded data list do not reload

The specific approach is: Encapsulates an article list component Then the article list traversal in the channel list out Because the article list component request data access lists articles need channel id, so the channel id as props list component parameter passed to the article, for convenience, we the channel directly to the object is passed to the article list component. Request the corresponding list data in the article list and display it in the list. Finally, the component is iterated through the channel list, as shown below.Copy the code

1, create a SRC/views/home/components/article – list. Vue props receive the parent component passed channel object

<template> <div class="article-list"> </div> </template> <script> export default {name: 'ArticleList', components: {}, // props props: {channel: {type: Object, required: true}}, data () {return {}}, computed: {}, watch: {}, created () {}, mounted () {}, methods: {} } </script> <style scoped lang="less"></style>Copy the code

2. Register in home/index.vue to pass the channel object from parent to child to the article list component