uniapp传值集（3）

//组件穿透值传递
//允许一个祖先组件向其所有子孙后代组件注入一个依赖，不论组件层次有多深，并在起上下游关系成立的时间里始终生效。

/*<uni-popup ref="popup" type="dialog" ：maskClick="true">
    <uni-popup-dialog
	     type="input" 
	     message="成功消息" 
	     :duration="2000" 
	     :before-close="true" 
	     @close="close" 
	     @confirm="confirm">
     </uni-popup-dialog>
</uni-popup>*/

//popup.js
const config={
	// 顶部弹出
	top:'top',
	// 底部弹出
	bottom:'bottom'
}
export default {
	data(){
		return {
			config:config
		}
	}	
}


//uni-popup 
import popup from './popup.js'
export default {  //注入一个依赖
	props: {
		maskClick:{ 
			type: [ Number,String],
			default: false
		}
	},
	provide() {
		return {
			// 父组件中返回要传给下级的数据 eg:this.maskClick  this.方法名
			popup: this //子代可以同popup 来访问当前实例中的属性和方法
			//将当前实例全部注入 后代
		}
	},
	mixins: [popup],//混入
	//mixins 选项接收一个混入对象的数组。这些混入对象可以像正常的实例对象一样包含实例选项，
	//这些选项将会被合并到最终的选项中，使用的是和 Vue.extend() 一样的选项合并逻辑。
	
	//Vue.mixin() 可以将自定义的方法混入所有的 Vue 实例中，谨慎使用
	//全局注册一个混入，影响注册之后所有创建的每个 Vue 实例  ,全局混入接受一个对象
	data() {
		return {
			otitle:"症状查询",
			ntitle:"筛选"
		};
	},
	methods:{
		close() {
			this.$emit('change', { //调用当前实例的方法  eg:关闭当前弹窗
				show: false,
				type: this.type
			})
			//可以访问config   混入
				this.connfig.top   ...	
			}
	}
	
}

//uni-popup-dialog
//子代组件中
export default {
	props: {
		type: {
			type: [String, Number],
			default: ''
		},
		placeholder: {
			type: [String, Number],
			default: '请输入内容'
		}
	},
	data() {
		return {
		};
	},
	inject: ['popup'],// 依赖 provide 的注入名
	methods:{
		close() {
			this.popup.close()  //调用uni-popup 的关闭弹窗时间
		}
	}
}