프런트엔드 사양 I (명명 사양)

1.lowercase: 첫 번째 단어는 소문자로 시작하고 두 번째 단어의 첫 글자는 대문자로 시작합니다 (예: firstName 및 lastName).

2.CamelCase: 각 단어의 첫 글자는 대문자로 표기해야 합니다 (예: FirstName 및 LastName).

3.snake_case: snake method 라고도 하는 밑줄 이름 지정 방법은 소문자와 밑줄로 구성되며 두 단어는 아래쪽 선으로 연결됩니다. 예: 이름.

4. 구운 문자열-대/소문자 명명: 중간 줄 명명은 문자열 명명이라고도 하며 모든 단어는 밑줄 "-"로 연결됩니다. 예: 이름

강제 사용: 밑줄 이름 지정 방법

명명 규칙: 1. 파일 이름에는 공백을 사용할 수 없습니다.

2. 파일명은 소문자만 사용하고 대문자는 사용하지 않는 것이 좋습니다.

3. 파일 이름에 여러 단어가 포함된 경우 연결 (-) 으로 단어를 구분하는 것이 좋습니다.

4. 복수구조가 있으니 복수형을 사용해야 합니다.

예: 로그인, 오류 페이지, 아이콘

강제 사용: 모두 대문자

강조하기 위해 대문자를 사용하여 일부 파일의 파일 이름을 설명할 수 있습니다.

예: readme 파일

추가 정보: 읽어보기 파일 표준

◎ 프로젝트 소개.

◎ 주의사항.

◎ 온라인 샘플 주소 (테스트, 공식).

◎ 운영 환경 지원.

◎ 필요한 의존 준비 및 설립 방법.

◎ 프로젝트 설치 가이드.

관련 문서 링크.

관련 인원의 연락처 정보.

README.md 의 예:

강제 사용: 작은 고비 이름 지정 방법

명명 규칙: 동사를 접두사로 하고, 명의를 가지고 있다.

1 및 onXxx 수신 이벤트에 대한 콜백

2.handleXxx 는 이벤트를 처리합니다.

3. 값을 가져옵니다.

4.setXxx 값을 설정합니다.

일반적인 장면:

첫째, 이벤트 처리:

(1).onXxx 는 이벤트를 사전 예방적으로 모니터링하고, handleXxx 는 사후 대응에 사용됩니다.

예: onXxxSubmit: 양식 제출

HandleXxxSizeChange: 페이지 변경 사항 처리

HandleXxxPageChange: 페이지 크기 변경 처리

Onxxxkeydown:' 키 누르기'

(2) 기타 명명: 요소+클릭, 요소+변경, 선택+범위.

예: select all XXX:' 모두 선택'

XxxCellClick: "이 이벤트는 셀을 누를 때 트리거됩니다."

Xxxsortchange:' 이 이벤트는 테이블의 정렬 조건이 변경될 때 트리거됩니다'

B, 추가, 삭제, 변경 및 쿼리 처리:

추가: Xxx 를 추가하여 하위를 추가합니다.

CreateXxx 는 대형 프로젝트를 작성합니다.

삭제: deleteXxx 가 정말로 삭제되었습니다.

RemoveXxx 유사 제거

변경: Xxx 업데이트

확인: getXxx 에서 가져온 원시 데이터를 수정해야 합니다.

Xxx 원시 데이터 가져오기

예: getUserList: "사용자 목록 가져오기", fetchToken: "토큰 가져오기", deleteUser: "사용자 삭제", "removeTag:" 태그 삭제 ","updateupdateups "

C.API 인터페이스 함수:

Get: getXxxApi

게시물: postXxxApi

패치: patchXxxApi

Delect: delectXxxApi

도메인 이름: xxxUrl

일반 속성 변수 강제 사용: 작은 고비 이름 지정 방법

부울 값 1

명명 규칙: 판단 동사를 접두사로 사용

HasXxx 는 값이 포함되어 있는지 여부를 결정합니다. True: 이 값을 포함합니다. False: 값이 포함되지 않습니다.

IsXxx 는 값인지 여부를 결정합니다. 참: 값입니다. False: 값이 아닙니다.

예: isShow: "표시 여부", isLoading: "로드 여부", hasToken: "토큰 포함 여부",

2, 배열 이름 지정

명명 규칙: 명사+목록 조합 사용

예: 사용자 목록: 사용자 목록

3. 개인 속성 변수

명명 규칙: 밑줄 (_) 로 시작하는 접두어는 변수 이름 지정과 동일합니다.

4. 열거 변수 \textcolor{red}{ 강제 사용: 큰 고비 명명법}

열거 속성은 모두 대문자를 사용하며 단어는 밑줄로 구분됩니다.

예: 대상 상태 = {reading: 1, 읽기: 2, 적용됨: 3, 준비: 4};

5. 상수: 강제 사용: 모두 대문자를 사용하고 밑줄로 단어를 구분합니다.

강제 사용: 큰 고비 이름 지정 방법

명명 규칙: vue 공식 홈페이지 스타일 가이드를 참조하십시오.

예: 1, 기능별로 이름을 지정합니다.

2. 특정 스타일과 규칙을 적용하는 기본 구성 요소 (예: 표시 클래스, 비논리적 또는 무상태형 구성 요소) 는 Base, app 또는 v 와 같은 특정 접두어로 시작해야 합니다 .....

3. 구성 요소 이름은 고급 (일반적으로 요약) 단어로 시작하고 설명 수식어로 끝나야 합니다.

예: 어셈블리/

|- BaseButton.vue

|- BaseTable.vue

|- BaseIcon.vue

강제 사용: 밑줄 이름 지정 방법

명명 규칙:

1.class, id, label 및 attribute 의 이름 지정은 가능한 한 간단명료해야 하며 문자로 시작해야 하며 모든 문자는 소문자여야 하며 단어 사이에는 대시 "-"를 연결해야 합니다.

2. 클래스는 해당 모듈 또는 구성 요소의 내용이나 기능을 나타내야 하며 스타일 정보로 이름을 지정해서는 안 됩니다.

요소 id 는 페이지가 고유한지 확인해야 합니다.

4. 스타일 정보가 없는 클래스 생성을 금지합니다.

예:

1, 가능한 한 약어나 약어를 사용하지 마십시오. 템플릿 = & gttmp, message = & gtmsg, image = & gtimg, property => 를 제외한 이러한 단어는 약어로 간주됩니다.

2, 읽기 가능한 이름 지정이 짧은 이름 지정보다 우선합니다.

3. 길이가 읽기 불편함을 방지하기 위해 이름 지정 길이는 20 자 미만이어야 합니다.

4. 명명에는 구체적인 의미가 있어야 하며, 일부 의미가 일반적이고 구체적인 의미가 없는 단어는 사용하지 말아야 한다.

5. 병음은 사용하지 말고 중국어는 사용하지 마세요.

6. 정규식은 Exp 로 끝납니다.

7.Ref: ref 로 끝납니다.