handleclick 哪兒報錯
<!DOCTYPE html>
<html>
?? ?<head>
?? ??? ?<meta charset="utf-8">
?? ??? ?<title></title>
?? ??? ?<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
?? ?</head>
?? ?<body>
?? ??? ?<div id="root">
?? ??? ??? ?<div>
?? ??? ??? ??? ?<input v-model="inputValue" />
?? ??? ??? ??? ?<button @click="handleSubmit">提交</button>
?? ??? ??? ?</div>
?? ??? ??? ?<ul>
?? ??? ??? ??? ?<!-- <li v-for="(item,index) of list" :key="index"> -->
?? ??? ??? ??? ?<!-- ?? ?{{item}} -->
?? ??? ??? ??? ?<todo-item v-for="(item,index) of list"
?? ??? ??? ??? ?:key="index"
?? ??? ??? ??? ?:content='item'
?? ??? ??? ??? ?:index="index"
?? ??? ??? ??? ?@delete='handleDelete'????????? 監(jiān)聽handleDelete事件
?? ??? ??? ??? ?>
?? ??? ??? ??? ?</todo-item>
?? ??? ??? ??? ?<!-- </li> -->
?? ??? ??? ?</ul>
?? ??? ?</div>
?? ??? ?<script>
?? ??? ??? ?Vue.component('todo-item',{
?? ??? ??? ??? ?props: ['content',index],
?? ??? ??? ??? ?template: '<li @click='handleClick'>{{content}}</li>',
?? ??? ??? ??? ?methods: handleClick: function(){
?? ??? ??? ??? ??? ? this.$emit('delete',this.index)
?? ??? ??? ??? ??? ? }
?? ??? ??? ??? ?}
?? ??? ??? ??? ?
?? ??? ??? ?})
?? ??? ??? ?
?? ??? ??? ?new Vue({
?? ??? ??? ??? ?el:"#root",
?? ??? ??? ??? ?data:{
?? ??? ??? ??? ??? ?inputValue: "",
?? ??? ??? ??? ??? ?list: []
?? ??? ??? ??? ?},
?? ??? ??? ??? ?methods: {
?? ??? ??? ??? ??? ?handleSubmit: function(index){
?? ??? ??? ??? ??? ??? ?this.list.push(this.inputValue)
?? ??? ??? ??? ??? ??? ?this.inputValue = ''
?? ??? ??? ??? ?},
?? ??? ??? ??? ?handleDelete:function(){
?? ??? ??? ??? ??? ?this.list.splice(index,1)
?? ??? ??? ??? ?}
?? ??? ??? ??? ?
?? ??? ??? ?}
?? ??? ??? ?})
?? ??? ?</script>
?? ?</body>
</html>
2021-01-08
我的理解,組件中methods是個對象,而不是一個函數(shù),畢竟method帶有s哦
2019-10-18
2019-07-18
應(yīng)該用雙引號 @click="HandClick"index? ?而且上面漏了單引號? props:['content','index']
2019-07-17
methods:{
handleSumbit:function(){
this.list.push(this.inputValue);
this.inputValue = '';
},
handleDelete:function(index){
this.list.splice(index,1);
}
}
2019-07-15
不是這個問題
2019-07-15
你的method方法,掉了參數(shù)index,應(yīng)該為
handleDelete:function(index){ ? ? ? ? ? ?
this.list.splice(index,1)? ? ? ??
}