码迷,mamicode.com
首页 > 其他好文 > 详细

vue添加,删除内容

时间:2018-10-23 15:43:19      阅读:228      评论:0      收藏:0      [点我收藏+]

标签:添加内容   let   exp   export   center   key   splice   col   input   

vue 提交添加内容,点击删除内容

1 html

<input v-model="inputValue" />
    <button @click="handClick">提交</button>
    <ul>
        <todo-item 
        v-for="(item,index) in list" :key="index"
        :content="item"
        :index=‘index‘
        @delete="handdelete"
        ></todo-item>
    </ul>

2 js 

export default {
        data(){
            return{
                inputValue:‘‘,
                list:[]
            }
        },
        methods:{
        //点击提交添加内容 handClick(){
this.list.push(this.inputValue) this.inputValue=‘‘ }, // @delete="handdelete" 监听子组件的方法 delete handdelete(index){ //接收子组件传过来的index 进行删除 this.list.splice(index,1) } } }

 

vue添加,删除内容

标签:添加内容   let   exp   export   center   key   splice   col   input   

原文地址:https://www.cnblogs.com/lidonglin/p/9836812.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!