Pass value from parent to child
Method 1 (Writing of uniapp-vue2)
1. Father sends message to son
Parent component sends information to child component
index.view
import Bank from './components/bank.vue'
export default {
components: {
Bank },
data() {
return {
bank: '你好',
}
}
}
// template部分
<Bank :bank="bank"></Bank>
Child components receive parent component information
/components/bank.vue
// js部分
export default {
props: {
bank: {
type: String,
//还可写成 default: () => {}, 默认值=> default: true
}
}
<template>
<view>{
{
bank}}</view>
</template>
2. The son sends a message to the father
Note: Sometimes the data transferred from the child to the father is more complex, and the data obtained in the applet will be different from the app and H5. Small program receiving method: item.target.__args__[0] Note: Since there are no spaces in the above, csdn causes this to be displayed
The child component sends information to the parent component
/components/bank.vue
this.$emit('closeTestPage', true)
Parent component receives child component information
index.view
import Bank from './components/bank.vue'
export default {
components: {
Bank },
}
// template部分
<Bank @closeTestPage="closeTestPage"></Bank>
Method 2 (Writing of uniapp)
Brief description : uniapp does not have fixed how to write parent-to-son and son-to-father respectively, where emit is the trigger event, and on is the receive event .
Note : Since the emit is created and triggered first, and then the on has not been created successfully, the reception is unsuccessful, so a timer should be added to the emit
//触发：
setTimeout(() => {
uni.$emit('bank', this.bank);
}, 100);
//另一个页面接收
uni.$on('bank', (bank) => {
this.bank = bank;
this.init();
});
Remember to like it if it is useful to you~