Dieses Mal werde ich Ihnen einen JSON-Server zur Implementierung der Back-End-Datensimulation vorstellen. Was sind die Vorsichtsmaßnahmen für den JSON-Server zur Implementierung der Back-End-Datensimulation? ein Blick.
Während des Entwicklungsprozesses werden Front-End und Back-End getrennt oder nicht. Die Schnittstelle wird größtenteils später mit der Seite entwickelt, daher ist es unbedingt erforderlich, eine restliche APL-Schnittstelle einzurichten, um virtuelle Daten bereitzustellen Das Front-End, daher verwende ich hier JSON. Als Tool unterstützt der Server CORS- undJSONP-domänenübergreifende Anforderungen, unterstützt GET-, POST-, PUT-, PATCH- und DELETE-Methoden und bietet außerdem eine Reihe von AbfrageMethoden, wie Limit, Bestellung usw., dann habe ich meine eigenen Nutzungsdetails in ein Dokument geschrieben
Installation
Zunächst muss eine Knotenumgebung vorhanden sein (JSON-Server wird verwendet. Es muss eine Knotenumgebung vorhanden sein) Dann JSON-Server global installierennpm install json-server -g
G:\demo\JavaScript\Vue\Vue one\project\my-project\Vue_two\my-project>json-server -h index.js [options] <source> Options: --config, -c Path to config file [default: "json-server.json"] --port, -p Set port [default: 3000] --host, -H Set host [default: "0.0.0.0"] --watch, -w Watch file(s) [boolean] --routes, -r Path to routes file --middlewares, -m Paths to middleware files [array] --static, -s Set static files directory --read-only, --ro Allow only GET requests [boolean] --no-cors, --nc Disable Cross-Origin Resource Sharing [boolean] --no-gzip, --ng Disable GZIP Content-Encoding [boolean] --snapshots, -S Set snapshots directory [default: "."] --delay, -d Add delay to responses (ms) --id, -i Set database id property (e.g. _id) [default: "id"] --foreignKeySuffix, --fks Set foreign key suffix (e.g. _id as in post_id) [default: "Id"] --quiet, -q Suppress log messages from output [boolean] --help, -h Show help [boolean] --version, -v Show version number [boolean] Examples: index.js db.json index.js file.js index.js http://example.com/db.json https://github.com/typicode/json-server
{ "api": [ { "text": "数据统计", "link": "#", "hot": true }, { "text": "数据检测", "link": "#", "hot": true }, { "text": "流量分析", "link": "#", "hot": true }, { "text": "广告发布", "link": "#", "hot": false } ] }
"json": "json-server db.json --port 3003"
npm run json
> vue@1.0.0 json g:\demo\JavaScript\Vue\Vue one\project\my-project\Vue_two\my-project > json-server db.json --port 3003 \{^_^}/ hi! Loading db.json Done Resources http://localhost:3003/api Home http://localhost:3003 Type s + enter at any time to create a snapshot of the database
this.$http.get('http://localhost:3003/api') .then((data) => { console.log(data.body) }, () => { console.log('这里是用了vue-source,后端没有接口') })
Detaillierte Erklärung der Schritte zum Zuschneiden von Bildern mit Vue-Cropper
Detaillierte Erklärung der Schritte für die Nutzung der Vue Mixin-Funktion
Das obige ist der detaillierte Inhalt vonDer JSON-Server implementiert die Back-End-Datensimulation. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!