如果您嘗試從應用程式外部分配變數,則不會得到很好的反映。為什么行為會根據應用程式在 HTML 標簽上的安裝方式而改變?
此代碼不起作用
<div id="app">
<ul v-for="player in players">
<li>{{player.name}}, {{player.age}}</li>
</ul>
</div>
<!-- VueJS -->
<script src="https://unpkg.com/[email protected]"></script>
<script>
let app= Vue.createApp({
data() {
return {
players : []
}
},
})
app.mount("#app") //<--- here
app.players=[
{name: 'nobita', age: 13},
{name: 'suneo', age: 13},
{name: 'sizuka', age: 13},
{name: 'takeshi', age: 13},
]
</script>
此代碼有效:
<div id="app">
<ul v-for="player in players">
<li>{{player.name}}, {{player.age}}</li>
</ul>
</div>
<script>
let app= Vue.createApp({
...
}).mount("#app") //<--- here
app.players=[
{name: 'nobita', age: 13},
{name: 'suneo', age: 13},
{name: 'sizuka', age: 13},
{name: 'takeshi', age: 13},
]
</script>
uj5u.com熱心網友回復:
Vue.createApp()創建一個應用程式實體,用于配置應用程式設定,例如注冊組件、指令和全域道具。應用程式實體在其API 中回傳根組件。mount()
如您所見,組件資料只能通過組件參考進行更新。
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/328306.html
上一篇:將值傳遞給多個函式
