Häufig gestellte Fragen zu uni-app plus vue3

1. Führen Sie lokale JSON-Dateien ein

1.Abrufmethode

fetch APIZum Laden von Dateien verwenden 本地JSON.

<script>
	fetch('/source/dataJson/drugsList.json')
	.then(res=>res.json())
	.then(data=>{
      
      
		console.log(data)
	})
</script>

fetchDer Parameter der Funktion ist der lokale JSONDateipfad. Achten Sie auf die Richtigkeit des Pfads. .then()Analysieren und reagieren Sie auf die Daten mit der Methode, .json()konvertieren Sie sie mit der Methode JSON格式und geben Sie schließlich die erforderliche Datenlernadresse aus
.

2.axios

1. Axios installieren

npm  i axios -s

2.Verwenden Sie (drugList.vue)

<script>
import axios from 'axios'
axios.get('http://localhost:3000/source/dataJson/drugsList.json').then((res) => {
      
      
	console.log(res)
})
</script>

3. Object.assign()

1.JSON-Datei (drugsList.json)

{
    
    
    "code": 0,
    "data": {
    
    
        "b2cDirectoryIdChildList": [],
        "brandIdChildList": [],
        "commentImgUrl": "",
        "commentLinkUrl": "",
        "commentMsg": "",
        "commentType": "1",
        "deliveryText": "",
        "filterInfoList": [],
        "groupShops": [],
        "isCityOpened": 0,
        "isListData": 0,
        "pageNo": 1,
        "pageSize": 20
        }
}

2. Datei verwenden (drugList.vue)

<script>
import dataBasemap from '@/source/dataJson/drugsList.json'
export default {
      
      
	data() {
      
      
		let config = {
      
      }
		Object.assign(config, dataBasemap)
		return {
      
      
			drugsList: config
		};
	},
	mounted(){
      
      
		consloe.log(drugsList)
	}
}
</script>

Hinweis:
1. Vue3 wird verwendet esModule(export导入,import引入)und unterstützt keine commonJSSpezifikation ( requireImport)
. 2. uni.requestEs kann keine lokalen JS-Dateien und JSON-Dateien lesen. jqEs kann gelesen werden, aber es kann nur importiert und jqam Ende H5verwendet werden .