uniapp子传父、父传子

1.首先要创建一个子组件，

项目名一般为components，再建一个vue文件，组件名字首字母要大写，例如：Son.vue

2.在page文件下建立一个父组件vue文件，

例如：index.vue

3.在父组件中引入子组件，有两种方法，分别是局部引入和全局引入

局部引入

在父组件中（index.vue）<script>的第一行写     

import 组件名 from '路由'  例如：import Son from './components/Son.vue'

全局引入

在main.js中写

import 组件名 from '路由'  

Vue.component('组件名'，变量)

例如：

import Son from './components/Son.vue'

Vue.component('Son'，Son)

注意：要写在vue下面

4.注册子组件

在export default 里面第一行写

 components：{组件名}

 例如：export default {
            components :{
            Son    
            },

5.父传子

父组件

写入子组件，例如<Son  :number="num" @sendNum="getNum" />

定义一个方法监听一下

 methods: {
                    getNum(num)   {
                        console.log(num);
                    }
                }

子组件

例如<view class=""> 子组件{{number}}</view>

约束子组件

props: {
            number: {
                type: Number,
                default: 0, (默认值)

                 required:true
            }
        },

5.子传父

父组件

写入子组件，例如<Son  :number="num" @sendNum="getNum" />

子组件

通过emit方法，触发一个自定义时间，this.$emit('事件名'，值)

例如

methods: {
            sendNum() {
                this.$emit('sendNum', this.num)
            }
        },

例子父传子一个数字，再子传父

子组件

父组件