這里的想法是觀察 JSON 檔案中所做的更改，如果某些值發生更改，它會自動更改條件 v-if。
<div id="app">
<div v-if="content == 'one'">
<p>Content one</p>
</div>
<div v-else-if="content == 'two'">
<p>Contentn two</p>
</div>
</div>
現在棘手的部分來了，我需要能夠在構建后更改 JSON 檔案，并自動更改將顯示的內容。
new Vue({
el: "#app",
data: {
content: ''
},
methods: {
// import of JSON and value that will assign value to this.content
// Now value can be 'one' or 'two'
}
})
uj5u.com熱心網友回復：
無法查看 json 檔案中的更改。您可以做的是將 json 設定為回應式屬性并檢查那里的更改。更改 JSON 時，您還需要更新回應屬性，以便觸發觀察者
new Vue({
el: "#app",
data: {
content: ''
},
watch: {
content: function (val) {
// do something when content has changed
},
},
methods: {
importJson() {
// import json and set contents to content
},
saveJson(newJSON) {
this.content = newJSON
// Somehow save the json data to the json file
}
}
})
您現在應該知道對 JSON 檔案的更改不是持久的。
uj5u.com熱心網友回復：
我用 axios 解決了這個問題。:)
methods: {
updateData () {
axios.get('../static/client/data.json').then(response => {
console.log(response.data)
this.dataClient = response.data
})
}
},
created () {
this.updateData()
}
現在，當您在構建和重繪 瀏覽器后更改“dist”檔案夾中的 JSON 檔案時，它將加載新值。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/416979.html
標籤：
上一篇：如何在hadoop中創建新用戶
下一篇：GEThttp://localhost:8080/main.jsnet::ERR_CONNECTION_REFUSED部署在Netlify控制臺錯誤