小生愛

        
        <script>
                /* store.js */

                import Vue from 'vue'
                import Vuex from 'vuex'

                // 告诉 vue 使用 vuex
                Vue.use(Vuex)

                // 创建一个对象保存初始状态
                let state = {
                    count: 0
                }

                // getters 可以认为是store的计算属性
                // 第一个参数 state
                let getters = {
                    name: state => state.count + '- 小花'
                }

                // 创建store
                const store = new Vuex.Store({
                    state,
                    getters
                })

                export {store}

        </script>
        

        

        <!-- teacher.vue -->

        <template>
          <div>
            <Search></Search>
          </div>
        </template>

        <script>
            import {store} from './store.js'
            import Search from './search.vue'

            export default {
                // store 提供给 store 选项 可以把store的实例注入到所有的子组件
                store,
                components: {
                    Search
                }
            }
        </script>




        <!-- search.vue -->

        <template>
            <div class="search">
                <p>{{name}}</p>
            </div>
        </template>

        <script>
            export default {
                computed: {
                    name () {
                        // this.$store.getters 获取 getters 对象
                        return this.$store.getters.name
                    }
                }
            }
        </script>