I want to use vue to get the data of content in the last item in the conversation array in json, but my method fails to render and solve.
json data section:
{"dialogue": [
{
"name":"a",
"conversation":[
{
"speaker":"a",
"content":""
},
{
"speaker":"b",
"content":"The core idea"
},
{
"speaker": "a",
"content": ""
}
]
},
{
"name":"c",
"conversation":[
{
"speaker":"c",
"content":""
},
{
"speaker":"d",
"content":"The core idea"
}
]
}
]}template section:
<template>
<div id="dialogue">
<div id="chatcontent" v-for="thedialoge in dialogues">
<div id="scriptbar">
<!---->
{{thedialoge.conversation[thedialoge.conversation.length-1].content}}
</div>
</div>
</div>
</template> if the browser displays the code of the last object
{
"speaker": "a",
"content": "good point"
}
script section:
<script type="text/javascript">
import axios from "axios"
export default{
data() {
return {
dialogues:[],
}
},
created() {
axios.get("static/data.json").then(response =>
(this.dialogues=response.data.dialogue)
)
}
}
</script>