You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
xuan-pay-cweb/components/yunmiao-jobSelect/README.md

2.3 KiB

说明:适用于职位选择,带模糊搜索分类功能使用方便,基于uview组件库开发,使用本组件请确保引入uview!!!

  1. 引入文件
	import jobSelect from '@/components/yunmiao-jobSelect/yunmiao-jobSelect.vue'
export default {
		components: {
			jobSelect
		},
		..............

2.使用组件

<jobSelect ref="jobSelect" :listData="listData" @confirem="confiremJob"></jobSelect>

3.调用显示隐藏

this.$refs.jobSelect.show()
this.$refs.jobSelect.hide()

4.参数说明

参数 默认值 说明 类型
listData [ ] 选择数据 Array
labelName 'name' label展示字段 String
valueName 'id' value选中字段 String
selectValue [] 默认选中 Array
5.事件说明
方法 说明
---- ----
@confirem 返回选中的value
6.完整示例
<template>
	<view>
		<view @click="show">
			<text>展开区域选择</text>
		</view>
		<jobSelect ref="jobSelect" :listData="listData" @confirem="confiremJob"></jobSelect>
	</view>
</template>
<script>
	import jobSelect from '@/components/yunmiao-jobSelect/yunmiao-jobSelect.vue'
	export default {
		components:{
			jobSelect
		},
		data() {
			return {
				listData: [{
					"id": 1,
					"name": "餐饮",
					"children": [{
						"id": 2,
						"name": "服务员",
					},{
						"id": 3,
						"name": "送餐员",
					},{
						"id": 4,
						"name": "传菜员",
					},
					{
						"id": 5,
						"name": "厨师",
					}]
				},{
					"id": 6,
					"name": "家政保洁",
					"children": [{
						"id": 7,
						"name": "保洁",
					},{
						"id": 8,
						"name": "保姆",
					},{
						"id": 9,
						"name": "月嫂",
					}]
				},{
					"id":10 ,
					"name": "美容美发",
					"children": [{
						"id": 11,
						"name": "发型师",
					}]
				}],
			};
		},
		methods:{
			show() {
				this.$refs.jobSelect.show()
			},
			confiremJob(e){
				console.log(e)
			}
		}
	}
</script>
<style lang="scss">
</style>

作者联系方式:

qq:1315723390

wx:ZHT131572

开发交流群:点击加uniapp开发交流群:971617215