school picker

학교-피커

UNI-APP 개발 프레임 워크, 국립 대학교 (University) 선택기 에 적합한 구성 요소

구성 요소 설명

MPVUE-CityPicker를 기반으로 지역 데이터 수정 구현

대학 데이터는 CN-UniversitySRV 프로젝트에서 제공됩니다

Github 전체 문서 미리보기 : School-Picker

효과

학교 만 선택하십시오

주/도시/학교 중 하나를 선택하십시오

Wechat 애플릿

간단한 사용

1. 구성 요소 디렉토리의 SchoolPicker 디렉토리를 필요한 프로젝트에 복사하십시오.
2. 통화 코드

< template >
	< view >
		< button type = " primary " @click = " showSchoolPicker " >只选择学校</ button >

		< button style = " margin-top : 1 rem ; " type = " primary " @click = " showSchoolPicker2 " >省/市/学校</ button >

		< view style = " margin-top : 1 rem ; text-align : center ; " >{{schoolData}}</ view >
		<!-- 学校选择组件-->
		< schoolPicker themeColor = " #000 " ref = " schoolPicker " @onConfirm = " onConfirm " >
		</ schoolPicker >
		
		< schoolPicker :onlySchool = ' false ' themeColor = " #000 " ref = " schoolPicker2 " @onConfirm = " onConfirm2 " >
		</ schoolPicker >
		
		<!-- demo 跳转 -->
		< navigator url = " ../index/index " style = " margin-top : 1 rem ; " >
			< button type = " default " >查看另一demo</ button >
		</ navigator >
		
	</ view >
</ template >

< script >
	//高校学校列表组件
	import schoolPicker from ' ../../components/schoolPicker/schoolPicker.vue ' ;

	export default {
		components : {
			schoolPicker
		},
		data () {
			return {
				schoolData : ' '
			}
		},
		methods : {
			/**
			 * 打开学校选择器
			 */
			showSchoolPicker : function () {
				this . $refs . schoolPicker . show ()
			},
			/**
			 * 打开 省/市/学校 选择器
			 */
			showSchoolPicker2 : function () {
				this . $refs . schoolPicker2 . show ()
			},
			/**
			 * 确认学校选择
			 */
			onConfirm ( e ) {
				const school = e . label . split ( " - " )[ 2 ];
				console . log ( `源数据: ${ JSON . stringify (e) } ` );
				if (school === '暂未收录' ) {
					return ;
				} else {
					this . schoolData = school;
					console . log ( `学校: ${ school } ` );
				}
			},
			/**
			 * 确认 省/市/学校 选择
			 */
			onConfirm2 ( e ) {
				this . schoolData = e . label . split ( " - " ). reverse (). find ( v => v != '所有' );
			}
		}
	}
</ script >

구성 요소 매개 변수

만 학교

• 설명 : 구성 요소가 학교 데이터 만 선택할 수 있는지 여부
• 유형 : 부울
• 선택적 값 : 참/거짓
• 필요한지 여부 : 아니오
• 기본값 : true

다른 매개 변수

mpvue-citypicker 구성 요소 매개 변수를 참조하십시오