以下代碼,我很困惑為什么 add1 功能在按鈕單擊時不起作用?請注意代碼保存為 html 檔案并在 chrome 中運行。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hello Vue</title>
<script src="https://unpkg.com/vue@3"></script>
</head>
<body>
<div id="app">
<!-- TODO: this is the place for my quesiton, why add1 doesn't work -->
<button @click="add1">
Hello, count is {{count}}
</button>
</div>
</body>
</html>
<script>
const app = Vue.createApp({
data() {
return {
count: 0
}
}
},
methods = {
add1() {
alert("Click!")
count
}
}
)
app.mount('#app')
</script>
我在谷歌開發人員控制臺中看到的警告/錯誤訊息是:在渲染期間訪問了屬性“add1”,但未在實體上定義。并且,無關的非道具屬性 (add1) 已傳遞給組件,但無法自動繼承,因為組件呈現片段或文本根節點。
uj5u.com熱心網友回復:
您的應用宣告有語法錯誤,并且不包括methods
. 嘗試:
const app = Vue.createApp({
data () {
return {
count: 0
}
},
methods: {
add1 () {
alert("Click!")
count
}
}
})
app.mount('#app')
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/507920.html