vuex：store传值/组件之间相互调用方法

赋值 this.$store.commit('add', 3);
异步赋值 this.$store.dispatch('addAsync')
计算属性取值 this.$store.getters.方法名
取值 this.$store.state.全局变量名称

var Event = new Vue();　　　　　　相当于又new了一个vue实例，Event中含有vue的全部方法；
Event.$emit('msg',this.msg);　　　   发送数据，第一个参数是发送数据的名称，接收时还用这个名字接收，第二个参数是这个数据现在的位置；

methods:{
			getLogin(){
				uni.$emit('play-video', {
					status: 'open',
				})
			},
		}

Event.$on('msg',function(msg){　　接收数据，第一个参数是数据的名字，与发送时的名字对应，第二个参数是一个方法，要对数据的操作
　　　　//逻辑区
})

created() {
		uni.$on('play-video', (data) => {
			console.log("我是appId："+this.$customConfig.appId)
		})
	},

https://www.cnblogs.com/sunsanfeng/p/emit.html 

其它全局变量的引入：https://www.cnblogs.com/yangchin9/p/11002636.html

                                https://www.cnblogs.com/hpx2020/p/10936279.html

一、什么是vuex

        

二、优点

共享数据、易于维护

数据共享、提高开发速度

各个组件之间的数据都是实时同步的

三、什么场景使用

组件之间共享的数据
 

四、引入和使用

        4.1、在根目录下创建 store/index.js 文件

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

Vue.use(Vuex)

const store = new Vuex.Store({
	state: {
		
	},
	mutations: {
		
	},
	actions: {
	
	},
	getters: {
		
	}
})

export default store

        4.2、在 main.js 中引入 store/index.js 文件

import Vue from 'vue'
import App from './App'
import store from './store'

Vue.prototype.$store = store

//挂载
const app = new Vue({
	store,
    ...App
})

app.$mount()

        4.3、使用

                4.3.1、所有的共享数据都要统一放到store的state中进行存储

                4.3.2、组件访问state数据

                        4.3.2.1、第一种： this.$store.state.全局变量名称 

                        4.3.2.2、第二种： 从vuex中按需导入mapState函数      

//引入mapGetters
import { mapGetters } from 'vuex'
//按需导入参数
computed: {
    ...mapGetters([
      'count',//需要的参数
    ]),

  },

                4.3.3、赋值（mutations）： 用于变更Store中的数据（只有mutations才有变更Store数据的权限）。

                        4.3.3.1、第一种：调用mutations中的方法： this.$store.commit('add', 3);//add为mutations中的一个方法；3为传值

                        4.3.3.2、第二种：

import{ mapMutations } from 'vuex'
	export default {
		computed:{
			...mapMutations([
				'addN'
			]),
		},
        methods:{
            test(){
                this.addN(3) // addN为请求方法、3为请求参数
                
            }
        }，
    }

                        4.3.3.3、 mutations 中不允许写异步代码 不如定时器

                                                如果非要使用异步操作可以选择使用actions 

                4.3.4、异步操作（actions）：

actions: {
    addAsync(context){
        stTimeout(() =>{
            context.commit('add')
        }, 1000)

    }
}

                        4.3.4.1、第一种： this.$store.dispatch('addAsync')

                        4.3.4.2、第二种： 

                

import{ mapActions } from 'vuex'
	export default {
		computed:{
			...mapActions([
				'addN'
			]),
		},
        methods:{
            test(){
                this.addN(3) // addN为请求方法、3为请求参数
                
            }
        }，
    }

                4.3.5、计算属性（getters）：

                        4.3.5.1、第一种： this.$store.getters.方法名

                        4.3.5.2、第二种： import { mapGetters } from 'vuex'

     4.4、取值（mapState）：

	import{ mapGetters, mapMutations, mapState } from 'vuex'
	export default {
		computed:{
			...mapState([
				'userInfo',
			]),
		},
    }

                 userInfo.avatarUrl

                 

五、