As a novice in web development, I am currently working with vue-cli3.0 and a local server.
<template>
<div>
</div>
</template>
<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator';
@Component({
components: {
},
})
export default class Test extends Vue
{
mounted(){
this.readJson("./resources/doc.json")
}
readJson(filePath) {
var request = new XMLHttpRequest();
request.open("GET",filePath, false);
console.log(request)
// request.send(null)
// var my_JSON_object = JSON.parse(request.responseText);
// alert (my_JSON_object.result[0]);
}
}
</script>
After logging the request, the output reveals that many of its properties are set to null.
XMLHttpRequest {onreadystatechange: null, readyState: 1, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …} onabort: null onerror: null onload: null onloadend: null onloadstart: null onprogress: null onreadystatechange: null ontimeout: null readyState: 1 response: "" responseText: "" responseType: "" responseURL: "" responseXML: null status: 0 statusText: "" timeout: 0 upload: XMLHttpRequestUpload {onloadstart: null, onprogress: null, onabort: null, onerror: null, onload: null, …} withCredentials: false proto: XMLHttpRequest
I am seeking assistance as I encounter difficulties in this process.
I am unable to include an import statement here, which is why I would like to avoid using it.
Your help and guidance are greatly appreciated.
<template>
<div>
</div>
</template>
<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator';
@Component({
components: {
},
})
export default class Test extends Vue
{
mounted(){
this.readJson(require("./resources/doc.json"))
}
readJson(filePath) {
var request = new XMLHttpRequest();
request.open("GET",filePath, false);
console.log(request)
request.send(null)
var my_JSON_object = JSON.parse(request.responseText);
alert (my_JSON_object.result[0]);
}
}
</script>
I went ahead and made changes to my code accordingly.
However, upon checking the request object again, the issue persists.
An error message appeared:
vue.runtime.esm.js?2b0e:587 [Vue warn]: Error in mounted hook: "SyntaxError: Unexpected token < in JSON at position 0"
Interestingly, while exploring "filePath.ngldoc," I discovered some data! Could this data possibly be in the form of a JavaScript object?