problem description
in the single file component of vue. I bound a click event to a div. A handleCityClick method is triggered, and the interface shows that click has been bound to the div, but the callback method is not triggered?
the environmental background of the problems and what methods you have tried
wants to get the content of the button clicked to change the value of city in state, but the method cannot trigger the
method name has also been changed, @ click= "handleCityClick" with parentheses seems to be useless,
has nothing to do with the position of the mounted hook, and the
console has not reported an error.
related codes
/ / Please paste the code text below (do not replace the code with pictures)
<div class="button-list">
<div
class="button-wrap"
v-for="item of hots"
:key="item.id"
@click="handleCityClick()"
>
<div class="button">{{item.name}}</div>
</div>
</div>
export default {
name: "CityList",
props: {
hots: Array,
cities: Object,
letter: String
},
methods: {
handleCityClick () {
debugger
alert(1)
}
},
watch: {
letter () {
if (this.letter) {
const element = this.$refs[this.letter][0]
this.scroll.scrollToElement(element)
}
}
},
mounted () {
this.scroll = new BScroll(this.$refs.wrapper)
}
}
what result do you expect? What is the error message actually seen?
if you want to get the content of clicking div, there is no error message