전단 데이터 시 뮬 레이 션 Mock. js 사용 튜 토리 얼

3037 단어 데이터 전송
Mock. js 는 아 날로 그 데 이 터 를 생 성하 고 AJAX 를 차단 하 는 도구 입 니 다.앞 뒤 가 분 리 된 전단 동창 회 는 자주 사용한다.
     Mock. js 홈 페이지 주소:http://mockjs.com
설치 하 다
     npm install --save mockjs
예시
import Mock from 'mockjs';

//    AJAX    
let data = Mock.mock({
    //    list        ,     1   10    

    'list|1-10': [{
        //    id       ,     1,    1

        'id|+1': 1

    }]

});

console.log(JSON.stringify(data, null, 4));

//   AJAX    
//    '/v1/user'  ajax     ,           
Mock.mock('/v1/user', {
    'list|1-10': [{
        'id|+1': 1,
        'email': '@EMAIL'
    }]
})

3. 데이터 템 플 릿 정의 규범 DTD
     1. 'name | rule': value
        name: 속성 명;rule: 생 성 규칙;value: 속성 값.
     2. 규칙 을 만 드 는 7 가지 형식
           (1) 'name | min-max'  //min - max 개 생 성
           (2) 'name | count'  //count 개 생 성
           (3) 'name | min-max.dmin-dmax'
                부동 소수점 을 생 성 합 니 다. 정수 부분 은 min 보다 크 고 max 보다 작 으 며 소수 부분 은 dmin - dmax 위 치 를 유지 합 니 다.
           (4) 'name | min-max.dcount'
                부동 소수점 을 생 성 합 니 다. 정수 부분 은 min 보다 크 고 max 보다 작 으 며 소수 부분 은 dcount 위 치 를 유지 합 니 다.    
           (5) 'name | count.dmin-dmax'
           (6) 'name | count.dcount'
           (7) 'name | +step'  //속성 값 자동 step 추가   
     3. 속성 값 중 @ 자리 차지 문자 가 있 을 수 있 습 니 다.
        속성 값 은 최종 값 의 초기 값 과 유형 도 만 들 었 습 니 다.
     4. 속성 값 의 데이터 형식 은 String, Number, Boolean, Object, Array, Function, RegExp 일 수 있 습 니 다.
자리 차지 문자
     1. 자리 차지 문자 의 위 치 는 기록 에 따라 해당 하 는 데 이 터 를 생 성 합 니 다.
Mock.mock('@email')
 //"[email protected]"

Mock.mock({email: '@email'})  
//{ email: "[email protected]" }
    2. 자리 차지 문자 형식
        @자리 표시 자
        @자리 표시 자 (매개 변수 [, 매개 변수])
    3. 자리 표시 자 선택 가능 한 값
Type
Method
Basic
boolean, natural, integer, float, character, string, range, date, time, datetime, now
Image
image, dataImage
Color
color
Text
paragraph, sentence, word, title, cparagraph, csentence, cword, ctitle
Name
first, last, name, cfirst, clast, cname
Web
url, domain, email, ip, tld
Address
area, region
Helper
capitalize, upper, lower, pick, shuffle
Miscellaneous
guid, id 
     4. Mock. Random 으로 자리 표시 자 를 확장 할 수 있 습 니 다.
5. Mockjs API
     1. Mock.mock(rurl?, rtype?, template | function(options))
     2. Mock.setup({timeout: 400})
        400 밀리초 후에 야 응답 한 내용 을 되 돌려 주 는 것 을 나타 내 고 값 도 '200 - 600' 일 수 있 으 며 200 - 600 밀리초 사이 에 있 음 을 나타 내 며 기본 값 은 '10 - 100' 입 니 다.
     3. Mock.Random
        각종 기록 데 이 터 를 생 성 하 는 데 사용 합 니 다.
     4. Mock.valid(template, data)
        실제 데이터 데이터 데이터 가 데이터 템 플 릿 template 과 일치 하 는 지 확인 합 니 다.
     5. Mock.toJSONSchema(template)

좋은 웹페이지 즐겨찾기