layui ---> [최적화] 최적화 매개 변수

다음 코드를 최적화 할 수 있습니다

그림 삽입 설명 여기

  • 위의 코드 반복 응용 프로그램 적어도 10 페이지.
  • 당신이 함수를 수정하려면, 당신은 적어도 10 페이지를 수정해야합니다. 큰 불편을 가져-유지 보수를 게시하려면.
  • 핵심은 프로그램을 볼 필요가없는이 정보는 것입니다. (가)는 롤오버 할 때마다, 시간 낭비를 시작하기에 배치.

[참고 부호 것을 행수는 후자가 사용된다]

매개 변수 분류

  1. 면책 조항 카테고리 : 특정 형식 layui 모듈 참조
  2. 일반 카테고리 : 여러 페이지에 매개 변수의 공통의 일부
  3. 특별 카테고리 : 호출 한 후 모듈은 몇 가지 일반적인 매개 변수의 여러 페이지를 생성

  • mar.use에 매개 변수를 전달 만 호출 월 모듈의 시작, 책임
  • 매개 변수가 생성되기 때문에 내부적으로 함수를 사용합니다. 당신은 콜백 함수를 전달할 필요가 그래서

[팁 : 같은를 찾거나 코드에 약간의 변화가 핵심이다]

라인 : 180 ~ 200

  • 이 라인은 기본적으로 클래스 선언이다
    그림 삽입 설명 여기
  • 로 다음이다 우리는 월 범주를 사용하려면 :
layui.use('Mar', () =>{
	const mar = new Mar(layui);
	// 假设我们想用到layui的layer函数
	const cb = ( {layer} ) =>{
		layer.msg('ok', {icon: 1});
	}
	mar.use(cb);	
})
  • 원래 클래스는 월 다음
    그림 삽입 설명 여기
  • 우리는 다른 페이지에서 사용할 수 있기 때문에, 원본 파일을 이동하지 않으려 고, 그래서 개선은 다음과 같습니다 :
class Mar {
	constructor (conf) {
		this.$layui = conf;
	}
	use (cb) {
		cb(this.layui)
	}
}

그림 삽입 설명 여기

  • 이 경우, 네이티브 destructuring 할당 및 사용자 정의 모듈을 layui 사용하여.

선 201 ~ 213 ~ 203,207,209

  • 이 라인은 일반 카테고리 페이지에 속하는
    그림 삽입 설명 여기
    그림 삽입 설명 여기
  • 다음 단계는 마운트 몇 가지 일반적인 변수를하는 것입니다 $layui
class Mar {
	constructor (conf) {...},
	use(cb) {
		this.$layui.$domLine = '#chart-index-echartLine';
		cb(this.$layui) 
	}
}
  • 월 클래스 테스트 전화
layui.use('Mar', () => {
	const mar = new Mar(layui);
	const cb = ( { layer, $domLine} ) =>{
		layer.msg($domLine, {icon: 1});
	};
	mar.use(cb);
})

그림 삽입 설명 여기

라인 : 206208

  • 이 라인은 사용의 클래스에 속하는
    그림 삽입 설명 여기
    그림 삽입 설명 여기
  • 여기에 사용 된 모듈 jqueryadmin
  • 그리고 관리자로부터 필요한 해체 JQuery와 layui입니다
class Mar{
	construcotr(){/**/}
	use(cb) {
		const { $, admin} = this.$layui;
		this.$layui.view = $('#VIEW-list-mqi');
		this.$layui.lineNo = admin.data()['lineNo'];
	}
}

설명

  • 페이지는 코드의 약 25 라인의 평균 양을 줄일 수 있습니다
  • 페이지 일반 매개 변수 반환 사용 월 클래스, 10 항에있어서,
  • 다른 일반 템플리트가 나중에 경우, 당신은 방법 인수를 다시 작성할 수 있습니다.
게시 된 177 개 원래 기사 · 원 찬양 22 ·은 20000 +를 볼

추천

출처blog.csdn.net/piano9425/article/details/103452511