我想每次點擊更改計數變數。如果我將“count ”放在 on:clik 事件中,它就會起作用。但是,當我想使用一個函式時,它什么也不做。我也嘗試將組件和“新視圖”放在同一個檔案 js 中,但不起作用并顯示空白頁,為什么?謝謝
Prova.js
Vue.component('prova', {
data: function () {
return {
count: 0
}
},
template: '<div><button v-on:click="Add">You clicked me {{ count }} times.</button></div>',
methods:{
Add: function(){
prova.count ;
}
}
});
索引.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>prova component</title>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
<script type="text/javascript" src="Prova.js"></script>
</head>
<body>
<section id="prova">
<prova ></prova>
<script>
new Vue({
el: "#prova",
})
</script>
</section>
</body>
</html>
uj5u.com熱心網友回復:
其實我不知道你的第二個component是什么,但你可以這樣解決你的問題:
在模板中
<template>
<div>
<button @click="addCount()"></button>
<div>You have clicked the button {{count}} times.</div>
</div>
</template>
? @click 與 v-on:click 相同
? 你應該像下面這樣寫: addCount()
在腳本中:
export default {
data() {
return {
count: 0,
}
},
methods: {
addCount() {
this.count = 1;
}
}
}
?count在您的資料中定義
? 使用方法,并在click按鈕上的每一個上將當前值加 1
這應該可以解決您的問題。如果這對您有用,請給我一個簡短的反饋!
對于小測驗:您也可以從count. 只需創建第二個button并在那里創建另一個單擊事件即可使用this.count -= 1。每次單擊它都會減去 1。
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/375537.html
下一篇:如何從html元素獲取陣列索引?
