老师 请修改
来源：2-14 编程练习
慕函数4234673
2020-05-19 13:19:55
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>组件间传值</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
<input type="text" v-model="inputvalue">
<button v-on:click="btn">增加</button>
<ul>
<tode-item v-bind:content="item"
v-bind:indec="index"
v-for="(item,index) in list"
v-on:pluss="pps"
>
</tode-item>
</ul>
</div>
<script>
var todeItem={
props:["content","indec"],
template:"<li @click='hanss'>{{content}}</li>",
methods:{
hanss:function(){
this.$emit("pluss",this.indec)
}
}
}
var app = new Vue({
el: "#app",
components:{
todeItem:todeItem
},
data:{
inputvalue:"",
list:[]
},
methods:{
btn:function(){
if(Number(this.inputvalue)){
this.list.push(this.inputvalue)
this.inputvalue=""
}else{
alert("请输入数字")
}
},
pps:function(index){
this.list.splice(index,1,this.inputvalue++)
}
}
})
</script>
</body>
</html>
1回答
-
好帮手慕言
2020-05-19
同学你好，子组件向父组件传递数据时，可以将当前组件对应的数值也传递过去，进行操作。如下：
如果我的回答帮到了你，欢迎采纳，祝学习愉快~
0
相似问题