one Technical specifications

1.Mock. Js is a front-end technology that simulates JSON data.

2. For the project where the front and back end are separated, the API data of the back-end engineer is not online.

3. Front-end engineers do not have JSON data for data filling, and it is too heavy to write back-end simulation by themselves;

4. Mock. Js solves this problem and allows the front-end engineer to be more independent.

5. Official website: Mockjs.com; Pre-school foundation: Vue2. X foundation can be learned after completion;

two Install the test

1. There are two installation modes: one is run under Node and the other is run under browser.

2. If you want to run it under Node, you need to install Node. js.

3. After installation, we first test whether Node is installed in webstorm or VScode terminal, and run the following command:

node -v

4. Create Mock directory. Install Mock.

npm install mockjs

5. Create a js file and type the sample code for the official website:

// introduce mock.js, equivalent to SRC =mock.js const mock = require('mockjs'); / / create a simulated data const data = Mock. The Mock ({/ / the value of the attribute list is an array, containing elements of 1 to 10 'list | 1-10' : [{/ / attribute id is the one from the number, the initial value is 1, 1 'id | + 1: each 1}]}); Console. log(data); // Convert JSON format console.log(json.stringify (data, null, 4));Copy the code

6. If you want to run the test in the browser, import the following files directly into the HTML file;

<script src="http://mockjs.com/dist/mock.js"></script>

Practice code:

<! DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>01</title> <script src="http://mockjs.com/dist/mock.js"></script> <script> const data = Mock.mock({ 'list|1-10' : [{ 'id|+1' : 1 }] }); console.log(data); console.log(JSON.stringify(data, null, 4)); </script> </head> <body> </body> </html>Copy the code