iview modal 父子组件传值

在 iView Modal 中，父子组件传值可以通过以下步骤实现：

1. 在父组件中定义一个数据变量，用来存储需要传递给子组件的数据。

2. 在父组件中创建一个方法，用来打开 Modal，并将数据变量传递给子组件。

3. 在子组件中，通过 props 来接收父组件传递过来的数据。

4. 在子组件中，通过 $emit() 方法来向父组件发送事件，并将需要传递的数据作为参数传递。

下面是一个简单的示例：

// 父组件
<template>
  <div>
    <Button type="primary" @click="openModal">打开 Modal</Button>
    <Modal v-model="visible" title="Modal" @on-ok="ok">
      <Child v-bind:data="data" @on-change="handleChange"></Child>
    </Modal>
  </div>
</template>
<script>
import Child from './Child.vue'

export default {
  components: {
    Child
  },
  data() {
    return {
      visible: false,
      data: {}
    }
  },
  methods: {
    openModal() {
      this.visible = true
      this.data = {name: '张三', age: 18}
    },
    ok() {
      console.log('ok')
    },
    handleChange(data) {
      console.log(data)
    }
  }
}
</script>

// 子组件
<template>
  <div>
    <p>{{data.name}}</p>
    <p>{{data.age}}</p>
    <Button type="primary" @click="changeData">修改数据</Button>
  </div>
</template>
<script>
export default {
  props: {
    data: Object
  },
  methods: {
    changeData() {
      this.$emit('on-change', {name: '李四', age: 20})
    }
  }
}
</script>

在上面的示例中，父组件中定义了一个数据变量 data，用来存储需要传递给子组件的数据。在打开 Modal 的方法 openModal 中，将 data 赋值为 {name: '张三', age: 18}，并将 visible 设为 true，以打开 Modal。在 Modal 中，通过 v-bind 将 data 传递给子组件 Child，并监听子组件的 on-change 事件。在子组件中，通过 props 接收父组件传递过来的数据，并在 changeData 方法中通过 $emit() 向父组件发送事件，并将需要传递的数据作为参数传递。在父组件中，通过 @on-change 监听子组件的事件，并在 handleChange 方法中处理传递过来的数据。