在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/Java  HTML/ vue組件的$emit()在傳遞參數(shù)的時候的一個小問題

vue組件的$emit()在傳遞參數(shù)的時候的一個小問題

話不都說，上代碼：
Vue.component('todoItem',{

        props:['item','index'],
        template:`<li @click="$emit('deleteitem',this.index)">{{index}}{{item}}</li>`
    })

在做子組件向父組件進行傳值的時候，$emit()犯法傳遞的參數(shù)的時候，我把參數(shù)寫成this.index。我想知道如果這樣傳值的話，這里的this.index指的是什么？

完整的代碼

clipboard.png

完整代碼
<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="UTF-8">
<title>使用組件改造todolist</title>
<link rel="stylesheet" href="./main.css">
<script src="./vue.js"></script>

</head>
<body>

<h1>使用組件改造todolist</h1>
<hr>
<p><b></b></p>
<div id="app">
    <input type="text" v-model='inputValue' @keyup.enter='handleClick'>
    <button @click='handleClick'>提交</button>
    <ul>
        <todo-item  
        v-for='(item,index) in list' 
        :item='item' 
        :key='index' 
        :index='index'
        @deleteitem='deleteli'
        >
        </todo-item>
    </ul>
</div>
<script>
    Vue.component('todoItem',{
        props:['item','index'],
        template:`<li @click="$emit('deleteitem',this.index)">{{index}}{{item}}</li>`
    })
    var app = new Vue({
        el:'#app',
        data:{
            list:[],
            inputValue:''
        },
        methods:{
            handleClick(){
                this.list.push(this.inputValue);
                this.inputValue=''
            },
            deleteli(index){
                this.list.splice(index,1)
            }
        }
    })
</script>

</body>
</html>

回答
編輯回答
不歸路

<li @click="$emit('deleteitem',index)">{{index}}{{item}}</li>

2018年2月22日 21:47
編輯回答
陪我終
this.index === index // true
2017年12月10日 20:40