Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop’s value. Prop being mutated: “value”
一个报错记录 大概意思是不可以直接修改父组件传过来的值
我这里写的是不对的 涉及公司内容 不全贴代码 只贴问题
props: {
value: {
type: Boolean,
default: false
},
methods: {
valueChange (newVal) {
this.value = newVal
this.$emit('input', newVal)
},
这里的value是父组件传过来的 不能直接修改
可以用$emit 来触发父组件函数修改value 这里我写个例子
父组件
<hhh :title="value" @changeValue="changeValue"></hhh>
子组件
<template>
<div @click="changeV">
{{title}}
</div>
</template>
//这是一个弹窗
<script>
export default {
name: "hhh",
props:{
title:"一个例子",
},
methods:{
changeV(){
//this.title = "改变title"; //这行去掉 不能直接改变props中参数的值
this.$emit('changeValue',"改变它吧"); //通知父组件改变。
}
}
}
</script>
父组件的changeValue 函数会拿到自组件传来的值 改变value
changeValue(emit){
this.value = emit
}