有没有人帮忙看看我的点击删除为什么没有反应,也不报错..

来源:3-4 实现todolist的删除功能

小盆友敲带蚂

2020-07-19 22:10

<body>

<div id="root">

<div>

<input v-model="inputValue" />

<button @click="Submit">提交</button>

</div>

                

<ul>

   <todo-item 

           v-for="(item,index) of list" 

           :key="index"

           :content="item"

           :index="index"

           @delete="handleDelete"

           >

               

           </todo-item>

</ul>

</div>

    

<script>

       

Vue.component('todo-item',{ 

            props:['content','index'],     

template:'<li>{{content}}</li>',

            methods:{

                handleClick:function(){

                    this.$emit('delete',this.index)

                },

            }

})


new Vue({

el:"#root", 

data:{   

inputValue:'',

list:[],

},

methods:{

Submit:function() {

this.list.push(this.inputValue)


this.inputValue=''

},

                handleDelete:function(index){

                    this.list.splice(index, 1)

                }

},



})

</script>

</body>


写回答 关注

2回答

  • 一个神仙
    2020-11-18 18:03:43

    template:'<li>{{content}}</li>',改为template:"<li @click='handleClick'>{{msg}}</li>"

  • 小盆友敲带蚂
    2020-07-19 22:15:41

    自问自答,因为上节课没有跟着做,li上面没有绑定click事件

    宝慕林117...

    哈哈哈哈

    2021-04-15 15:22:54

    共 1 条回复 >

vue2.5入门

快速理解Vue编程理念上手Vue2.0开发。

146156 学习 · 655 问题

查看课程

相似问题