函数式组件是无状态，他无法实例化，没有任何的生命周期和方法，创建函数式组件也很简单，只需要在模板添加’functional’声明即可。一般适合只依赖于外部函数的变化而变化的组件，因其轻量，渲染性能也会有所提高。
    组件需要的一切都是通过’context’参数传递。他是一个上下文对象，具体属性查看文档。这里’props’是一个包含所有绑定属性的对象。
    函数式组件：

    1. <!-- List.vue -->
    2. <template>
    3.   <div class="list">
    4.     <div
    5.       class="item"
    6.       v-for="item in props.list"
    7.       :key="item.id"
    8.       @click="props.itemClick(item)"
    9.     >
    10.       <p>{{item.title}}</p>
    11.       <p>{{item.content}}</p>
    12.     </div>
    13.   </div>
    14. </template>

    父组件中使用

    1. <template>
    2.   <div>
    3.     <List :list="list" :itemClick="item => (currentItem = item)" />
    4.   </div>
    5. </template>
    6. <script>
    7.   import List from '@/components/List.vue'
    8.   export default {
    9.     component: {
    10.       List,
    11.     },
    12.     data() {
    13.       return {
    14.         List: [
    15.           {
    16.             title: 'title1',
    17.             content: 'content1',
    18.           },
    19.         ],
    20.         currentItem: '',
    21.       }
    22.     },
    23.   }
    24. </script>

    文档：https://cn.vuejs.org/v2/guide/render-function.html#函数式组件