uniapp中父組件向子組件傳遞prop時,如果prop是對象,對象內部不能包含function屬性,例子如下
father.vue
<template>
<view class="uni-container">
<child :fatherData="fatherData" :fatherFcuntion="fatherFcuntion" :fatherMethod="fatherMethod"></child>
</view>
</template>
<script>
import child from './child.vue'
export default {
components: {
child
},
data() {
return {
fatherData: {
a: 1,
b: {
isShow: function() {
console.log("data定義對象屬性函數");
}
}
},
fatherFcuntion: function() {
console.log("data定義函數變量");
},
}
},
methods: {
fatherMethod() {
console.log("method的定義函數");
},
}
}
</script>
child.vue
<template>
<view>
child
</view>
</template>
<script>
export default({
name: "child",
props: {
fatherData: {
type: Object,
default: function() {
return {};
}
},
fatherFunction: {
type: Function,
default: function() {
return function() {}
}
},
fatherMethod: {
type: Function,
default: function() {
return function() {}
}
}
},
mounted() {
console.log("父組件data定義的變量包含函數", this.fatherData);
console.log("父組件data定義的函數變量", this.fatherFunction);
console.log("父組件method定義的函數", this.fatherMethod);
}
})
</script>
結果
![在這裏插入圖片描述](https://img-blog.csdnimg.cn/20200702173033111.png
可以看到展示數據
1.data定義的變量包含函數,函數屬性直接被刪除了
2.data定義的函數變量,可以正常傳遞
3.method定義的函數,可以正常傳遞
總結:uniapp的prop傳遞的變量爲對象時,對象內部含有函數屬性,該函數屬性會直接被刪除
Vue中的測試截圖
Vue中是可以正常傳遞,找個時間研究下uniapp關於prop的源碼